Difference between revisions of "Team:HUST-China/Human Practices"

Line 18: Line 18:
 
<link href="https://2018.igem.org/Team:HUST-China/css/animate?action=raw&amp;ctype=text/css" rel="stylesheet" />
 
<link href="https://2018.igem.org/Team:HUST-China/css/animate?action=raw&amp;ctype=text/css" rel="stylesheet" />
  
−
<link href="https://2018.igem.org/Team:HUST-China/css/style?action=raw&amp;ctype=text/css" rel="stylesheet" />
+
<!--<link href="https://2018.igem.org/Team:HUST-China/css/style?action=raw&amp;ctype=text/css" rel="stylesheet" /> -->
−
<link href="https://2018.igem.org/Team:HUST-China/css/main?action=raw&amp;ctype=text/css" rel="stylesheet" />
+
−
<!-- Vendor Styles -->
+
−
<link href="https://2018.igem.org/Team:HUST-China/css/magnific-popup?action=raw&amp;ctype=text/css" rel="stylesheet">
+
−
<!-- Block Styles -->
+
−
<link href="https://2018.igem.org/Team:HUST-China/css/gallery-1?action=raw&amp;ctype=text/css" rel="stylesheet">
+
−
<!--slider-->
+
−
<link rel="stylesheet" href="https://2018.igem.org/Team:HUST-China/css/menu-slider?action=raw&amp;ctype=text/css" type="text/css" />
+
 
<style type="text/css">
 
<style type="text/css">
−
.red-content{
+
/*
−
   color:#ff0057;
+
Author URI: http://webthemez.com/
 +
Note: Licence under Creative Commons Attribution 3.0 
 +
-------------------------------------------------------*/
 +
 
 +
@import url('http://fonts.googleapis.com/css?family=Noto+Serif:400,400italic,700|Open+Sans:400,600,700');
 +
@import url('font-awesome.css'); 
 +
@import url('animate.css');
 +
 
 +
body {
 +
  font-family:'Open Sans', Arial, sans-serif;
 +
  font-weight:300;
 +
  line-height:1.6em;
 +
  color:#656565;
 +
  font-size: 1.4em;
 +
  background: #ffffff;
 +
}
 +
a {
 +
    color: #0a0a0a;
 +
    text-decoration: none;
 +
}
 +
a:active {
 +
  outline:0;
 +
}
 +
 
 +
.clear {
 +
  clear:both;
 +
}
 +
 
 +
h1,h2{
 +
  font-weight: 600;
 +
  line-height:1.1em;
 +
  color: #e91e63;
 +
  margin-bottom: 20px;
 +
  text-transform: uppercase;
 +
}
 +
h3, h4, h5, h6 {
 +
  line-height:1.1em;
 +
  color: #212121;
 +
  margin-bottom: 20px;
 +
}
 +
input, button, select, textarea {
 +
    border-radius: 0px !important;
 +
}
 +
.timetable{background: #2ab975;padding: 5px 23px;}
 +
.timetable hr{
 +
  color:#fff;
 +
  padding-top: 29px;
 +
  margin-bottom: 20px !important;
 +
}
 +
.timetable dl{
 +
  color:#fff;
 +
}
 +
.timetable dt{
 +
  color:#fff;
 +
}
 +
.timetable dd{
 +
  color:#fff;
 +
}
 +
#wrapper{
 +
  width:100%;
 +
  margin:0;
 +
  padding:0;
 +
}
 +
ul.withArrow{
 +
 
 +
}
 +
ul.withArrow li{
 +
 
 +
}
 +
ul.withArrow li span{
 +
 
 +
margin-right: 10px;
 +
 
 +
font-weight: 700;
 +
 
 +
color: #0e0e0e;
 +
 
 +
border: 1px solid;
 +
 
 +
padding: 4px 8px;
 +
 
 +
font-size: 11px;
 +
 
 +
border-radius: 50%;
 +
 
 +
height: 20px;
 +
 
 +
width: 20px;
 +
}
 +
.widget {
 +
    color: #858585;
 +
}
 +
.row,.row-fluid {
 +
  margin-bottom:30px;
 +
}
 +
 
 +
.row .row,.row-fluid .row-fluid{
 +
  margin-bottom:30px;
 +
}
 +
 
 +
.row.nomargin,.row-fluid.nomargin {
 +
  margin-bottom:0;
 +
}
 +
.about-image img {
 +
    width: 100%;
 +
}
 +
img.img-polaroid {
 +
  margin:0 0 20px 0;
 +
}
 +
.img-box {
 +
  max-width:100%;
 +
}
 +
.navbar-default .navbar-toggle {
 +
    border-color: #ddd;
 +
    margin-top: 16px;
 +
}
 +
/*  Header
 +
==================================== */
 +
.topbar{
 +
  background-color: #e91e63;
 +
  padding: 0;
 +
  /* color:#fff; */
 +
}
 +
.topbar .container .row {
 +
    margin: 0;
 +
  padding:0;
 +
}
 +
.topbar .container .row .col-md-12 {
 +
  padding:0;
 +
}
 +
.topbar p{
 +
  margin:0;
 +
  display:inline-block;
 +
  font-size: 13px;
 +
  color: #f1f6ff;
 +
}
 +
.topbar p > i{
 +
  margin-right:5px;
 +
}
 +
.topbar p:last-child{
 +
  text-align:right;
 +
}
 +
header .navbar {
 +
    margin-bottom: 0;
 +
}
 +
.topbar li.topbar {
 +
    display: inline;
 +
    padding-right: 18px;
 +
    line-height: 52px;
 +
    transition: all .3s linear;
 +
}
 +
 
 +
.topbar li.topbar:hover {
 +
    color: #1bbde8;
 +
}
 +
 
 +
.topbar ul.info i {
 +
    color: #131313;
 +
    font-size: 16px;
 +
    font-style: normal;
 +
    margin-right: 8px;
 +
    display: inline-block;
 +
    position: relative;
 +
    top: 4px;
 +
}
 +
 
 +
.topbar ul.info span {
 +
    /* line-height: 42px; */
 +
    /* display: inline-block; */
 +
}
 +
 
 +
.topbar ul.info li {
 +
    float: right;
 +
    padding-left: 30px;
 +
    color: #ffffff;
 +
    font-size: 13px;
 +
    line-height: 44px;
 +
}
 +
 
 +
.topbar ul.info i span {
 +
    color: #aaa;
 +
    font-size: 13px;
 +
    font-family: "Rpboto", sans-serif;
 +
    font-weight: 400;
 +
    line-height: 50px;
 +
    padding-left: 18px;
 +
}
 +
.navbar-default {
 +
    border: none;
 +
}
 +
 
 +
.navbar-brand {
 +
    color: #222;
 +
    text-transform: uppercase;
 +
    font-size: 24px;
 +
    font-weight: 700;
 +
    line-height: 1em;
 +
    letter-spacing: -1px;
 +
    margin-top: 21px;
 +
    padding: 0 0 0 15px;
 +
}
 +
.navbar-default .navbar-brand{color: #e91e63;font-size: 24px;text-transform: uppercase;}
 +
.navbar-default .navbar-brand:hover {
 +
    color: #fff;
 +
}
 +
header .navbar-collapse  ul.navbar-nav {
 +
    float: right;
 +
    margin-right: 0;
 +
}
 +
header .navbar {min-height: 70px;padding: 18px 0;background: #1b1b1b;}
 +
.home-page header .navbar-default{
 +
    background: #1b1b1b;
 +
    /* position: absolute; */
 +
    width: 100%;
 +
}
 +
 
 +
header .nav li a:hover,
 +
header .nav li a:focus,
 +
header .nav li.active a,
 +
header .nav li.active a:hover,
 +
header .nav li a.dropdown-toggle:hover,
 +
header .nav li a.dropdown-toggle:focus,
 +
header .nav li.active ul.dropdown-menu li a:hover,
 +
header .nav li.active ul.dropdown-menu li.active a{
 +
    -webkit-transition: all .3s ease;
 +
    -moz-transition: all .3s ease;
 +
    -ms-transition: all .3s ease;
 +
    -o-transition: all .3s ease;
 +
    transition: all .3s ease;
 +
}
 +
 
 +
 
 +
header .navbar-default .navbar-nav > .open > a,
 +
header .navbar-default .navbar-nav > .open > a:hover,
 +
header .navbar-default .navbar-nav > .open > a:focus {
 +
    -webkit-transition: all .3s ease;
 +
    -moz-transition: all .3s ease;
 +
    -ms-transition: all .3s ease;
 +
    -o-transition: all .3s ease;
 +
    transition: all .3s ease;
 +
}
 +
 
 +
 
 +
header .navbar {
 +
    min-height: 62px;
 +
    padding: 0;
 +
}
 +
 
 +
header .navbar-nav > li  {
 +
    padding-bottom: 12px;
 +
    padding-top: 12px;
 +
    padding: 0 !important;
 +
}
 +
 
 +
header  .navbar-nav > li > a {
 +
    /* padding-bottom: 6px; */
 +
    /* padding-top: 5px; */
 +
    margin-left: 2px;
 +
    line-height: 40px;
 +
    font-weight: 700;
 +
    -webkit-transition: all .3s ease;
 +
    -moz-transition: all .3s ease;
 +
    -ms-transition: all .3s ease;
 +
    -o-transition: all .3s ease;
 +
    transition: all .3s ease;
 +
}
 +
section.dishes h2 {
 +
    color: #fff;
 +
}
 +
.services{
 +
 
 +
}
 +
.dishes{
 +
 
 +
background: #E91E63;
 +
 
 +
padding: 35px 0;
 +
 
 +
color: #ffffff;
 +
}
 +
.dropdown-menu li a:hover {
 +
    color: #fff !important;
 +
    background: #e91e63 !important;
 +
}
 +
 
 +
header .nav .caret {
 +
    border-bottom-color: #e91e63;
 +
    border-top-color: #e91e63;
 +
}
 +
.navbar-default .navbar-nav > .active > a,
 +
.navbar-default .navbar-nav > .active > a:hover,
 +
.navbar-default .navbar-nav > .active > a:focus {
 +
  background-color: #fff;
 +
}
 +
.navbar-default .navbar-nav > .open > a,
 +
.navbar-default .navbar-nav > .open > a:hover,
 +
.navbar-default .navbar-nav > .open > a:focus {
 +
  background-color: #e91e63;
 +
  color: #fff;
 +
}
 +
 
 +
 
 +
.dropdown-menu  {
 +
    box-shadow: none;
 +
    border-radius: 0;
 +
  border: none;
 +
}
 +
 
 +
.dropdown-menu li:last-child  {
 +
  padding-bottom: 0 !important;
 +
  margin-bottom: 0;
 +
}
 +
 
 +
header .nav li .dropdown-menu  {
 +
  padding: 0;
 +
}
 +
 
 +
header .nav li .dropdown-menu li a {
 +
  line-height: 28px;
 +
  padding: 3px 12px;
 +
}
 +
 
 +
/* --- menu --- */
 +
.flex-caption p {
 +
    line-height: 22px;
 +
    font-weight: 300;
 +
    color: #ffffff;
 +
    text-transform: capitalize;
 +
}
 +
header .navigation {
 +
  float:right;
 +
}
 +
 
 +
header ul.nav li {
 +
  border:none;
 +
  margin:0;
 +
}
 +
 
 +
header ul.nav li a {
 +
  font-size: 13px;
 +
  border:none;
 +
  font-weight: 600;
 +
  text-transform:uppercase;
 +
}
 +
 
 +
header ul.nav li ul li a { 
 +
  font-size:12px;
 +
  border:none;
 +
  font-weight:300;
 +
  text-transform:uppercase;
 +
}
 +
 
 +
 
 +
.navbar .nav > li > a {
 +
  color: #9a9a9a;
 +
  text-shadow: none;
 +
  border: 1px solid rgba(255, 255, 255, 0) !important;
 +
}
 +
 
 +
.navbar .nav a:hover {
 +
  background:none;
 +
  color: #2e8eda;
 +
}
 +
 
 +
.navbar .nav > .active > a,.navbar .nav > .active > a:hover {
 +
  background:none;
 +
  font-weight:700;
 +
}
 +
 
 +
.navbar .nav > .active > a:active,.navbar .nav > .active > a:focus {
 +
  background:none;
 +
  outline:0;
 +
  font-weight:700;
 +
}
 +
 
 +
.navbar .nav li .dropdown-menu {
 +
  z-index:2000;
 +
}
 +
 
 +
header ul.nav li ul {
 +
  margin-top:1px;
 +
}
 +
header ul.nav li ul li ul {
 +
  margin:1px 0 0 1px;
 +
}
 +
.dropdown-menu .dropdown i {
 +
  position:absolute;
 +
  right:0;
 +
  margin-top:3px;
 +
  padding-left:20px;
 +
}
 +
 
 +
.navbar .nav > li > .dropdown-menu:before {
 +
  display: inline-block;
 +
  border-right: none;
 +
  border-bottom: none;
 +
  border-left: none;
 +
  border-bottom-color: none;
 +
  content:none;
 +
}
 +
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus {color: #ffffff;background: #10cdff;border-radius: 0;}
 +
.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus {
 +
   color: #ffffff;
 +
  background-color: transparent;
 +
}
 +
 
 +
ul.nav li.dropdown a {
 +
  z-index:1000;
 +
  display:block;
 +
}
 +
 
 +
select.selectmenu {
 +
  display:none;
 +
}
 +
.pageTitle{color: #fff;margin: 30px 0 3px;display: inline-block;font-size: 28px;font-weight: 700;text-transform: uppercase;}
 +
 +
#banner{
 +
  width: 100%;
 +
  background:#000;
 +
  position:relative;
 +
  margin:0;
 +
  padding:0;
 +
}
 +
 
 +
/*  Sliders
 +
==================================== */
 +
/* --- flexslider --- */
 +
<style>
 +
html, body {
 +
  height: 100%;
 +
  padding: 0;
 +
  margin: 0;
 +
}
 +
 
 +
body {
 +
  background: #fff;
 +
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
 +
}
 +
 
 +
.js-transitions-disabled * {
 +
  -webkit-transition: none !important;
 +
  transition: none !important;
 +
}
 +
 
 +
.carousel {
 +
  position: relative;
 +
  height: 100%;
 +
  overflow: hidden;
 +
  -webkit-perspective: 50vw;
 +
  perspective: 50vw;
 +
  -webkit-perspective-origin: 50% 50%;
 +
  perspective-origin: 50% 50%;
 +
}
 +
 
 +
.carousel__control {
 +
  position: absolute;
 +
  height: 160px;
 +
  width: 40px;
 +
  background: #fff;
 +
  right: 0;
 +
  top: 0;
 +
  bottom: 0;
 +
  margin: auto;
 +
  z-index: 1;
 +
}
 +
 
 +
.carousel__control a {
 +
  position: relative;
 +
  display: block;
 +
  width: 100%;
 +
  padding-top: 75%;
 +
  box-sizing: border-box;
 +
}
 +
 
 +
.carousel__control a:hover:before { background-color: rgba(0,0,0,0.4); }
 +
 
 +
.carousel__control a.active:before, .carousel__control a.active:hover:before { background-color: rgba(0,0,0,0.6); }
 +
 
 +
.carousel__control a:first-child { margin-top: 15px; }
 +
 
 +
.carousel__control a:before {
 +
  position: absolute;
 +
  top: 50%;
 +
  left: 0;
 +
  right: 0;
 +
  margin: auto;
 +
  border-radius: 50%;
 +
  padding-top: 25%;
 +
  width: 25%;
 +
  background: rgba(0,0,0,0.2);
 +
  content: '';
 +
  display: block;
 +
  margin-top: -12.5%;
 +
}
 +
 
 +
.carousel__stage {
 +
  position: absolute;
 +
  top: 20px;
 +
  bottom: 20px;
 +
  left: 20px;
 +
  right: 20px;
 +
  margin: auto;
 +
  -webkit-transform-style: preserve-3d;
 +
  transform-style: preserve-3d;
 +
  -webkit-transform: translateZ(calc(-50vh + 20px));
 +
  transform: translateZ(calc(-50vh + 20px));
 +
}
 +
 
 +
.spinner {
 +
  position: absolute;
 +
width: calc(50vw - (20px));
 +
  height: calc(100vh - 40px);
 +
  top: 0;
 +
  left: 0;
 +
  right: auto;
 +
  bottom: 0;
 +
  margin: auto;
 +
  -webkit-transform-style: preserve-3d;
 +
  transform-style: preserve-3d;
 +
  -webkit-transition: -webkit-transform 1s;
 +
  transition: -webkit-transform 1s;
 +
  transition: transform 1s;
 +
  transition: transform 1s, -webkit-transform 1s;
 +
  -webkit-backface-visibility: hidden;
 +
  backface-visibility: hidden;
 +
  -webkit-transform-origin: 50% 50%;
 +
  transform-origin: 50% 50%;
 +
  -webkit-transform: rotateX(0);
 +
  transform: rotateX(0);
 +
}
 +
 
 +
.js-spin-fwd .spinner {
 +
  -webkit-transform: rotateX(-90deg);
 +
  transform: rotateX(-90deg);
 +
}
 +
 
 +
.js-spin-bwd .spinner {
 +
  -webkit-transform: rotateX(90deg);
 +
  transform: rotateX(90deg);
 +
}
 +
 
 +
.js-spin-fwd .spinner--right {
 +
  -webkit-transform: rotateX(90deg);
 +
  transform: rotateX(90deg);
 +
}
 +
 
 +
.js-spin-bwd .spinner--right {
 +
  -webkit-transform: rotateX(-90deg);
 +
  transform: rotateX(-90deg);
 +
}
 +
 
 +
.spinner--right {
 +
  right: 0;
 +
  left: auto;
 +
}
 +
 
 +
.spinner__face {
 +
  display: none;
 +
  position: absolute;
 +
  width: 100%;
 +
  height: 100%;
 +
  overflow: hidden;
 +
}
 +
 
 +
.spinner__face.js-next {
 +
  display: block;
 +
  -webkit-transform: rotateX(90deg) translateZ(calc(50vh - 20px));
 +
  transform: rotateX(90deg) translateZ(calc(50vh - 20px));
 +
}
 +
 
 +
.spinner--right .spinner__face.js-next {
 +
  -webkit-transform: rotateX(270deg) translateZ(calc(50vh - 20px));
 +
  transform: rotateX(270deg) translateZ(calc(50vh - 20px));
 +
}
 +
 
 +
.js-spin-bwd .spinner__face.js-next {
 +
  -webkit-transform: rotateX(-90deg) translateZ(calc(50vh - 20px));
 +
  transform: rotateX(-90deg) translateZ(calc(50vh - 20px));
 +
}
 +
 
 +
.js-spin-bwd .spinner--right .spinner__face.js-next {
 +
  -webkit-transform: rotateX(-270deg) translateZ(calc(50vh - 20px));
 +
  transform: rotateX(-270deg) translateZ(calc(50vh - 20px));
 +
}
 +
 
 +
.js-active {
 +
  display: block;
 +
  -webkit-transform: translateZ(calc(50vh - 20px));
 +
  transform: translateZ(calc(50vh - 20px));
 +
}
 +
 
 +
.content {
 +
  position: absolute;
 +
  width: 200%;
 +
  height: 100%;
 +
  left: 0;
 +
}
 +
 
 +
.spinner--right .content { left: -100%; }
 +
 
 +
.content__left, .content__right {
 +
  position: absolute;
 +
  left: 0;
 +
  top: 0;
 +
  width: 50%;
 +
  height: 100%;
 +
}
 +
 
 +
.content__right {
 +
  right: 0;
 +
  left: auto;
 +
}
 +
 
 +
.content__left {
 +
  background-repeat: no-repeat;
 +
  background-size: cover;
 +
}
 +
 
 +
.content__left:after {
 +
  position: absolute;
 +
  display: block;
 +
  content: "";
 +
  width: 100%;
 +
  height: 100%;
 +
  background-color: rgba(0,0,0,0.1);
 +
}
 +
 
 +
.content__left h1 {
 +
  position: absolute;
 +
  top: 50%;
 +
  margin-top: -3vw;
 +
  text-align: center;
 +
  font-family: oswald;
 +
  font-size: 5vw;
 +
  height: 10vw;
 +
  opacity: 1;
 +
  color: #fff;
 +
  width: 100%;
 +
  letter-spacing: 0.15em;
 +
  line-height: 0.6;
 +
}
 +
 
 +
.content__left span {
 +
  font-size: 1vw;
 +
  font-weight: 300;
 +
  letter-spacing: 0.2em;
 +
  opacity: 0.9;
 +
  font-family: Merriweather;
 +
}
 +
 
 +
.content__right {
 +
  display: -webkit-box;
 +
  display: -ms-flexbox;
 +
  display: flex;
 +
  -webkit-box-align: center;
 +
  -ms-flex-align: center;
 +
  align-items: center;
 +
  -webkit-box-pack: center;
 +
  -ms-flex-pack: center;
 +
  justify-content: center;
 +
}
 +
 
 +
.content__right .content__main {
 +
  position: absolute;
 +
  font-family: Merriweather, serif;
 +
  text-align: left;
 +
  color: #fff;
 +
  font-size: 1.3vw;
 +
  padding: 0 8vw;
 +
  line-height: 1.65;
 +
  font-weight: 300;
 +
  margin: 0;
 +
  opacity: 0.8;
 +
}
 +
 
 +
.content__right .content__main p:last-child {
 +
  text-transform: uppercase;
 +
  letter-spacing: 0.15em;
 +
  font-size: 0.85em;
 +
}
 +
 
 +
.content__right .content__index {
 +
  font-size: 30vh;
 +
  position: absolute;
 +
  right: -1vh;
 +
  top: 35vh;
 +
  opacity: 0.04;
 +
  font-family: oswald;
 +
  color: #fff;
 +
}
 +
 
 +
[data-type="carousel-1"] .content__left { background-image: url("https://static.igem.org/mediawiki/2018/d/d2/T--HUST-China--2018-Human_Practices-logo1.1.png.jpg"); }
 +
 
 +
.spinner--right [data-type="carousel-1"] .content__left { background-image: none; }
 +
 
 +
[data-type="carousel-2"] .content__left { background-image: url("https://static.igem.org/mediawiki/2018/0/0e/T--HUST-China--2018-Human_Practices-logo2.1.png.jpg"); }
 +
 
 +
.spinner--right [data-type="carousel-2"] .content__left { background-image: none; }
 +
 
 +
[data-type="carousel-3"] .content__left { background-image: url("https://static.igem.org/mediawiki/2018/f/f8/T--HUST-China--2018-Human_Practices-logo3.1.png.jpg"); }
 +
 
 +
.spinner--right [data-type="carousel-3"] .content__left { background-image: none; }
 +
 
 +
[data-type="carousel-4"] .content__left { background-image: url("https://static.igem.org/mediawiki/2018/2/24/T--HUST-China--2018-Human_Practices-logo4.1.png.jpg"); }
 +
 
 +
.spinner--right [data-type="carousel-4"] .content__left { background-image: none; }
 +
 
 +
 
 +
#main-slider:before {content: '';width: 100%;height: 100%;background: rgba(0, 0, 0, 0.65);z-index: 1;position: absolute;background: rgba(30, 30, 30, 0.31);}
 +
.flex-direction-nav a{
 +
display:none;
 +
}
 +
.flexslider {
 +
  padding:0; 
 +
  background: #fff;
 +
  position: relative;
 +
  zoom: 1;
 +
}
 +
.flex-direction-nav .flex-prev{
 +
left:0px;
 +
}
 +
.flex-direction-nav .flex-next{
 +
right:0px;
 +
}
 +
.flex-caption {zoom: 1;bottom: 198px;background-color: transparent;color: #fff;margin: 0;padding: 2px 25px 0px 30px;/* position: absolute; */left: 0;text-align: center;margin: 0 auto;right: 0px;display: inline-block;bottom: 10%;width: 50%;right: 0 !important;border-radius: 15px 15px 0 0;}
 +
.flex-caption h3 {color: #fff;letter-spacing: 0px;margin-bottom: 8px;text-transform: uppercase;font-size: 70px;font-weight: 700;}
 +
.flex-caption p {margin: 12px 0 18px;font-size: 20px;font-weight: 400;}
 +
.skill-home{
 +
margin-bottom:50px;
 +
}
 +
.c1{
 +
border: #ed5441 1px solid;
 +
background:#ed5441;
 +
}
 +
.c2{
 +
border: #24c4db 1px solid;
 +
background:#24c4db;
 +
}
 +
.c3{
 +
border: #1891EC 1px solid;
 +
background:#1891EC;
 +
}
 +
.c4{
 +
border: #609cec 1px solid;
 +
background:#609cec;
 +
}
 +
.skill-home .icons {padding: 38px;width: 94px;height: 94px;color: #fff;font-size: 42px;font-size: 38px;text-align: center;-ms-border-radius: 50%;-moz-border-radius: 50%;-webkit-border-radius: 50%;border-radius: 0;display: inline-table;border: 4px solid #efefef;color: #ff5722;background: transparent;border-radius: 50%;background: #ffffff;}
 +
.skill-home h2 {
 +
padding-top: 20px;
 +
font-size: 36px;
 +
font-weight: 700;
 +
}
 +
.testimonial-solid {
 +
padding: 50px 0 60px 0;
 +
margin: 0 0 0 0;
 +
background: #FFFFFF;
 +
text-align: center;
 +
}
 +
.testi-icon-area {
 +
text-align: center;
 +
position: absolute;
 +
top: -84px;
 +
margin: 0 auto;
 +
width: 100%;
 +
}
 +
.testi-icon-area .quote {
 +
padding: 15px 0 0 0;
 +
margin: 0 0 0 0;
 +
background: #ffffff;
 +
text-align: center;
 +
color: #1891EC;
 +
display: inline-table;
 +
width: 70px;
 +
height: 70px;
 +
-ms-border-radius: 50%;
 +
-moz-border-radius: 50%;
 +
-webkit-border-radius: 50%;
 +
border-radius: 50%;
 +
font-size: 42px;
 +
border: 1px solid #1891EC;
 +
display: none;
 +
}
 +
 
 +
.testi-icon-area .carousel-inner {
 +
margin: 20px 0;
 +
}
 +
.carousel-indicators {
 +
bottom: -30px;
 +
}
 +
.text-center img {
 +
margin: auto;
 +
}
 +
.aboutUs{
 +
padding:40px 0;
 +
background: #F2F2F2;
 +
}
 +
img.img-center {
 +
margin: 0 auto;
 +
display: block;
 +
max-width: 100%;
 +
}
 +
.home-about{
 +
  padding: 60px 0 0px;
 +
}
 +
.home-about hr{
 +
  padding:0;
 +
  margin:0;
 +
}
 +
.home-about .info-box{
 +
 
 +
}
 +
.projects {
 +
    padding: 60px 0;
 +
    background: #1b1b1b;
 +
    color: #a7a7a7;
 +
    border-top: 4px solid #e91e63;
 +
}
 +
 
 +
.card-content .price {
 +
    font-size: 14px;
 +
    color: #e91e63;
 +
}
 +
 
 +
.projects h4 {
 +
    font-size: 16px;
 +
    margin: 8px 0;
 +
}
 +
 
 +
.projects h5 {
 +
    font-weight: bold;
 +
    font-size: 14px;
 +
    margin: 0;
 +
}
 +
/* Testimonial
 +
----------------------------------*/
 +
.testimonial-area {
 +
padding: 0 0 0 0;
 +
margin:0;
 +
background: url(../img/low-poly01.jpg) fixed center center;
 +
background-size: cover;
 +
-webkit-background-size: cover;
 +
-moz-background-size: cover;
 +
-ms-background-size: cover;
 +
}
 +
.testimonial-solid p {
 +
color: #000000;
 +
font-size: 16px;
 +
line-height: 30px;
 +
font-style: italic;
 +
}
 +
section.hero-text {
 +
  background: #F4783B;
 +
  padding:50px 0 50px 0;
 +
  color: #fff;
 +
}
 +
section.hero-text h1{
 +
  color: #fff;
 +
}
 +
 
 +
/* Clients
 +
------------------------------------ */
 +
#clients {
 +
  padding: 60px 0;
 +
  }
 +
  #clients .client .img {
 +
    height: 76px;
 +
    width: 138px;
 +
    cursor: pointer;
 +
    -webkit-transition: box-shadow .1s linear;
 +
    -moz-transition: box-shadow .1s linear;
 +
    transition: box-shadow .1s linear; }
 +
    #clients .client .img:hover {
 +
      cursor: pointer;
 +
      /*box-shadow: 0px 0px 2px 0px rgb(155, 155, 155);*/
 +
      border-radius: 8px; }
 +
  #clients .client .client1 {
 +
    background: url("../img/client1.png") 0 -75px; }
 +
    #clients .client .client1:hover {
 +
      background-position: 1px 0px; }
 +
  #clients .client .client2 {
 +
    background: url("../img/client2.png") 0 -75px; }
 +
    #clients .client .client2:hover {
 +
      background-position: -1px 0px; }
 +
  #clients .client .client3 {
 +
    background: url("../img/client3.png") 0 -76px; }
 +
    #clients .client .client3:hover {
 +
      background-position: 0px 0px; }
 +
 
 +
 
 +
/* Content
 +
==================================== */
 +
 
 +
#content {
 +
  position:relative;
 +
  background: #ffffff;
 +
  padding:50px 0 0px 0;
 +
}
 +
 +
.cta-text {
 +
  text-align: center;
 +
  margin-top:10px;
 +
}
 +
 
 +
 
 +
.big-cta .cta {
 +
  margin-top:10px;
 +
}
 +
 +
.box {
 +
  width: 100%;
 +
}
 +
.box-gray  {
 +
  background: #f8f8f8;
 +
  padding: 20px 20px 30px;
 +
}
 +
.box-gray  h4,.box-gray  i {
 +
  margin-bottom: 20px;
 +
}
 +
.box-bottom {
 +
  padding: 20px 0;
 +
  text-align: center;
 +
}
 +
.box-bottom a {
 +
  color: #fff;
 +
  font-weight: 700;
 +
}
 +
.box-bottom a:hover {
 +
  color: #eee;
 +
  text-decoration: none;
 +
}
 +
 
 +
 
 +
/* Bottom
 +
==================================== */
 +
 
 +
#bottom {
 +
  background:#fcfcfc;
 +
  padding:50px 0 0;
 +
 
 +
}
 +
/* twitter */
 +
#twitter-wrapper {
 +
    text-align: center;
 +
    width: 70%;
 +
    margin: 0 auto;
 +
}
 +
#twitter em {
 +
    font-style: normal;
 +
    font-size: 13px;
 +
}
 +
 
 +
#twitter em.twitterTime a {
 +
  font-weight:600;
 +
}
 +
 
 +
#twitter ul {
 +
    padding: 0;
 +
  list-style:none;
 +
}
 +
#twitter ul li {
 +
    font-size: 20px;
 +
    line-height: 1.6em;
 +
    font-weight: 300;
 +
    margin-bottom: 20px;
 +
    position: relative;
 +
    word-break: break-word;
 +
}
 +
 
 +
 
 +
/* page headline
 +
==================================== */
 +
 
 +
#inner-headline{background: #e4e4e4;position: relative;margin: 0;padding: 0;color: #1891EC;}
 +
 
 +
 
 +
#inner-headline h2.pageTitle{
 +
  color: #e91e63;
 +
  padding: 5px 0;
 +
  display:block;
 +
  text-align: center;
 +
}
 +
 
 +
/* --- breadcrumbs --- */
 +
#inner-headline ul.breadcrumb {
 +
  margin:40px 0;
 +
  float:left;
 +
}
 +
 
 +
#inner-headline ul.breadcrumb li {
 +
  margin-bottom:0;
 +
  padding-bottom:0;
 +
}
 +
#inner-headline ul.breadcrumb li {
 +
  font-size:13px;
 +
  color:#fff;
 +
}
 +
 
 +
#inner-headline ul.breadcrumb li i{
 +
  color:#dedede;
 +
}
 +
 
 +
#inner-headline ul.breadcrumb li a {
 +
  color:#fff;
 +
}
 +
 
 +
ul.breadcrumb li a:hover {
 +
  text-decoration:none;
 +
}
 +
 
 +
/* Forms
 +
============================= */
 +
 
 +
/* --- contact form  ---- */
 +
form#contactform input[type="text"] {
 +
  width: 100%;
 +
  border: 1px solid #f5f5f5;
 +
  min-height: 40px;
 +
  padding-left:20px;
 +
  font-size:13px;
 +
  padding-right:20px;
 +
  -webkit-box-sizing: border-box;
 +
    -moz-box-sizing: border-box;
 +
          box-sizing: border-box;
 +
 
 +
}
 +
 
 +
form#contactform textarea {
 +
border: 1px solid #f5f5f5;
 +
  width: 100%;
 +
  padding-left:20px;
 +
  padding-top:10px;
 +
  font-size:13px;
 +
  padding-right:20px;
 +
  -webkit-box-sizing: border-box;
 +
    -moz-box-sizing: border-box;
 +
          box-sizing: border-box;
 +
 
 +
}
 +
 
 +
form#contactform .validation {
 +
  font-size:11px;
 +
}
 +
 
 +
#sendmessage {
 +
  border:1px solid #e6e6e6;
 +
  background:#f6f6f6;
 +
  display:none;
 +
  text-align:center;
 +
  padding:15px 12px 15px 65px;
 +
  margin:10px 0;
 +
  font-weight:600;
 +
  margin-bottom:30px;
 +
 
 +
}
 +
 
 +
#sendmessage.show,.show  {
 +
  display:block;
 +
}
 +
 +
form#commentform input[type="text"] {
 +
  width: 100%;
 +
  min-height: 40px;
 +
  padding-left:20px;
 +
  font-size:13px;
 +
  padding-right:20px;
 +
  -webkit-box-sizing: border-box;
 +
    -moz-box-sizing: border-box;
 +
          box-sizing: border-box;
 +
  -webkit-border-radius: 2px 2px 2px 2px;
 +
    -moz-border-radius: 2px 2px 2px 2px;
 +
      border-radius: 2px 2px 2px 2px;
 +
 
 +
}
 +
 
 +
form#commentform textarea {
 +
  width: 100%;
 +
  padding-left:20px;
 +
  padding-top:10px;
 +
  font-size:13px;
 +
  padding-right:20px;
 +
  -webkit-box-sizing: border-box;
 +
    -moz-box-sizing: border-box;
 +
          box-sizing: border-box;
 +
  -webkit-border-radius: 2px 2px 2px 2px;
 +
    -moz-border-radius: 2px 2px 2px 2px;
 +
      border-radius: 2px 2px 2px 2px;
 +
}
 +
 
 +
 
 +
/* --- search form --- */
 +
.search{
 +
  float:right;
 +
  margin:35px 0 0;
 +
  padding-bottom:0;
 +
}
 +
 
 +
#inner-headline form.input-append {
 +
  margin:0;
 +
  padding:0;
 +
}
 +
 
 +
.about-text h3 {
 +
  font-size: 18px;
 +
  padding-bottom: 0;
 
   font-weight: bold;
 
   font-weight: bold;
 
}
 
}
−
.content{
+
 
−
   padding-top:30px;  
+
.about-text .btn {
 +
  margin-top: 20px;
 +
  //font-size: 15px;
 +
  //text-align: justify;
 +
}
 +
 
 +
.about-image img {
 +
}
 +
 
 +
.about-text ul {
 +
  margin-top: 30px;
 +
   padding: 0;
 +
}
 +
 
 +
.about-text li {
 +
  margin-bottom: 10px;
 +
  //
 +
  font-weight: bold;
 +
  list-style: none;
 +
}
 +
 
 +
 +
.about-text-2 img {
 +
  border: 5px solid #ddd;
 +
  margin-bottom: 20px;
 +
}
 +
 
 +
.about-text-2 p {
 +
  margin-bottom: 20px;
 +
}
 +
 
 +
#call-to-action {
 +
  background: url(../images/bg/about.jpg) no-repeat;
 +
  background-attachment: fixed;
 +
  background-position: top center;
 +
  padding: 100px 0;
 +
  color: #fff;
 +
}
 +
 
 +
.call-to-action h3 {
 +
  font-size: 40px;
 +
  letter-spacing: 15px;
 +
  color: #fff;
 +
  padding-bottom: 30px;
 +
}
 +
 
 +
.call-to-action p {
 +
  color: #999;
 +
  padding-bottom: 20px;
 +
}
 +
 
 +
.call-to-action .btn-primary {
 +
  background-color: transparent;
 +
  border-color: #999;
 +
}
 +
 
 +
.call-to-action .btn-primary:hover {
 +
  background-color: #151515;
 +
  color: #999;
 +
  border-color: #151515;
 +
}
 +
 
 +
#call-to-action-2 {
 +
  background-color: #efefef;
 +
  padding: 50px 0;
 +
}
 +
#call-to-action-2 h3 {
 +
  color: #05142b;
 +
  font-size: 24px;
 
   font-weight: 600;
 
   font-weight: 600;
 +
  text-transform: uppercase;
 
}
 
}
−
.content-text{
+
#call-to-action-2 p {
−
   margin: 8px 0;
+
   color: #5f5f5f;
 +
  font-size: 15px;
 
}
 
}
 +
#call-to-action-2 .btn-primary {
 +
  border-color: #FFFFFF;
 +
  /* background: transparent; */
 +
  margin-top: 50px;
 +
  color: #fff;
 +
}
 +
section.section-padding.gray-bg {
 +
    background: #ffffff;
 +
    padding: 60px;
 +
    color: #484848;
 +
}
 +
 +
  #accordion-alt3 .panel-heading h4 {
 +
font-size: 13px;
 +
line-height: 28px;
 +
}
 +
.panel .panel-heading h4 {
 +
font-weight: 400;
 +
}
 +
.panel-title {
 +
margin-top: 0;
 +
margin-bottom: 0;
 +
font-size: 15px;
 +
color: inherit;
 +
}
 +
.panel-group .panel {
 +
margin-bottom: 0;
 +
border-radius: 2px;
 +
}
 +
.panel {margin-bottom: 18px;background-color: #FFFFFF;border: 1px solid #f3f3f3;border-radius: 2px;-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.05);box-shadow: 0 1px 1px rgba(0,0,0,0.05);}
 +
#accordion-alt3 .panel-heading h4 a i {font-size: 17px;line-height: 18px;width: 18px;height: 18px;margin-right: 8px;color: #A0A0A0;text-align: center;border-radius: 50%;margin-left: 6px;font-weight: bold;} 
 +
.progress.pb-sm {
 +
height: 6px!important;
 +
}
 +
.progress {
 +
box-shadow: inset 0 0 2px rgba(0,0,0,.1);
 +
}
 +
.progress {
 +
overflow: hidden;
 +
height: 18px;
 +
margin-bottom: 18px;
 +
background-color: #f5f5f5;
 +
border-radius: 2px;
 +
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
 +
box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
 +
}
 +
.progress .progress-bar.progress-bar-red {
 +
background: #ed5441;
 +
}
 +
.progress .progress-bar.progress-bar-green {
 +
background: #51d466;
 +
}
 +
.progress .progress-bar.progress-bar-lblue {
 +
background: #32c8de;
 +
}
 +
/* --- portfolio detail --- */
 +
.top-wrapper {
 +
  margin-bottom:20px;
 +
}
 +
.info-blocks {margin-bottom: 15px;/* background: #efefef; */}
 +
.info-blocks i.icon-info-blocks {float: left;color: #e91e63;font-size: 40px;min-width: 50px;margin-top: 11px;text-align: center;background: #f5f5f5;width: 72px;height: 72px;/* padding-top: 21px; *//* border: 1px solid #e0e0e0; */line-height: 75px;}
 +
.info-blocks .info-blocks-in {padding: 15px;overflow: hidden;background: #f5f5f5;}
 +
.info-blocks .info-blocks-in h3 {color: #202020;font-size: 20px;line-height: 28px;margin:0px;margin-bottom: 8px;/* font-weight: bold; */}
 +
.info-blocks .info-blocks-in p {font-size: 14px;}
 +
 
 +
blockquote {
 +
  font-size:16px;
 +
  font-weight:400;
 +
  font-family:'Noto Serif', serif;
 +
  font-style:italic;
 +
  padding-left:0;
 +
  color:#a2a2a2;
 +
  line-height:1.6em;
 +
  border:none;
 +
}
 +
 +
blockquote cite              { display:block; font-size:12px; color:#666; margin-top:10px; }
 +
blockquote cite:before          { content:"\2014 \0020"; }
 +
blockquote cite a,
 +
blockquote cite a:visited,
 +
blockquote cite a:visited        { color:#555; }
 +
 +
/* --- pullquotes --- */
  
−
th{
+
.pullquote-left {
−
  text-align:center;
+
  display:block;
−
  font-size:14px;
+
  color:#a2a2a2;
−
  font-weight: 800;
+
  font-family:'Noto Serif', serif;
 +
  font-size:14px;
 +
  line-height:1.6em;
 +
  padding-left:20px;
 
}
 
}
−
td
+
 
−
{
+
.pullquote-right {
−
     text-align:center;
+
  display:block;
 +
  color:#a2a2a2;
 +
  font-family:'Noto Serif', serif;
 +
  font-size:14px;
 +
  line-height:1.6em;
 +
  padding-right:20px;
 +
}
 +
 
 +
/* --- button --- */
 +
.btn{text-align: center;color: #FFFFFF;background: #e91e63;border-color: #e91e63;width: 120px;border-radius: 0;}
 +
.btn-theme {
 +
  color: #fff;
 +
  background: transparent;
 +
  border: 1px solid #fff;
 +
  padding: 12px 30px;
 +
  font-weight: bold;
 +
}
 +
a.btn.btn-details {
 +
    float: right;
 +
    margin-top: -34px;
 +
    font-size: 14px;
 +
    height: 34px;
 +
    width: 96px;
 +
     text-transform: capitalize;
 +
}
 +
.btn-theme:hover {
 +
  color: #eee;
 +
}
 +
 
 +
/* --- list style --- */
 +
 
 +
ul.general {
 +
  list-style:none;
 +
  margin-left:0;
 +
}
 +
 
 +
ul.link-list{
 +
  margin:0;
 +
  padding:0;
 +
  list-style:none;
 +
}
 +
 
 +
ul.link-list li{
 +
  margin:0;
 +
  padding:2px 0 2px 0;
 +
  list-style:none;
 +
}
 +
footer{background: #0e0e0e;}
 +
footer ul.link-list li a{
 +
  color: #8C8C8C;
 +
}
 +
footer ul.link-list li a:hover {
 +
  color: #e91e63;
 +
}
 +
/* --- Heading style --- */
 +
 
 +
h4.heading {
 +
  font-weight:700;
 +
}
 +
 
 +
.heading { margin-bottom: 30px; }
 +
 
 +
.heading {
 +
  position: relative;
 +
 
 +
}
 +
 
 +
 
 +
.widgetheading {
 +
  width:100%;
 +
  padding:0;
 +
  font-weight: bold;
 +
}
 +
 
 +
#bottom .widgetheading {
 +
  position: relative;
 +
  border-bottom: #e6e6e6 1px solid;
 +
  padding-bottom: 9px;
 +
}
 +
 
 +
aside .widgetheading {
 +
  position: relative;
 +
  border-bottom: #e9e9e9 1px solid;
 +
  padding-bottom: 9px;
 +
}
 +
 
 +
footer .widgetheading {
 +
  position: relative;
 +
}
 +
 
 +
footer .widget .social-network {
 +
  position:relative;
 +
}
 +
 
 +
.team-member h4{
 +
  text-align: center;
 +
  margin-bottom: 5px;
 +
}
 +
.team-member .deg{
 +
text-align:center;
 +
display:block;
 +
}
 +
#bottom .widget .widgetheading span, aside .widget .widgetheading span, footer .widget .widgetheading span { 
 +
  position: absolute;
 +
  width: 60px;
 +
  height: 1px;
 +
  bottom: -1px;
 +
  right:0;
 +
 
 +
}
 +
.panel-title>a {
 +
    color: inherit;
 +
    text-decoration: none;
 +
    font-weight: 600;
 +
}
 +
.box-area{padding: 15px;background: #ffffff;margin-top: -21px;border: 2px solid #f3f3f3;}
 +
.box-area h3{font-size: 17px;font-weight: 600;}
 +
/* --- Map --- */
 +
.map{
 +
  position:relative;
 +
  margin-top:-50px;
 +
  margin-bottom:40px;
 +
}
 +
 
 +
.map iframe{
 +
  width:100%;
 +
  height:450px;
 +
  border:none;
 +
}
 +
 
 +
.map-grid iframe{
 +
  width:100%;
 +
  height:350px;
 +
  border:none;
 +
  margin:0 0 -5px 0;
 +
  padding:0;
 +
}
 +
 
 +
 +
ul.team-detail{
 +
  margin:-10px 0 0 0;
 +
  padding:0;
 +
  list-style:none;
 +
}
 +
 
 +
ul.team-detail li{
 +
  border-bottom:1px dotted #e9e9e9;
 +
  margin:0 0 15px 0;
 +
  padding:0 0 15px 0;
 +
  list-style:none;
 +
}
 +
 
 +
ul.team-detail li label {
 +
  font-size:13px;
 +
}
 +
 
 +
ul.team-detail li h4, ul.team-detail li label{
 +
  margin-bottom:0;
 +
}
 +
 
 +
ul.team-detail li ul.social-network {
 +
  border:none;
 +
  margin:0;
 +
  padding:0;
 +
}
 +
 
 +
ul.team-detail li ul.social-network li {
 +
  border:none; 
 +
  margin:0;
 +
}
 +
ul.team-detail li ul.social-network li i {
 +
  margin:0;
 +
}
 +
 
 +
.navbar-brand i {
 +
    color: #ffffff;
 +
    font-size: 26px;
 +
    margin-right: 5px;
 +
    position: relative;
 +
    top: 3px;
 +
}
 +
.pricing-title{
 +
  background:#fff;
 +
  text-align:center;
 +
  padding:10px 0 10px 0;
 +
}
 +
 
 +
.pricing-title h3{
 +
  font-weight:600;
 +
  margin-bottom:0;
 +
}
 +
 
 +
.pricing-offer{
 +
  background: #fcfcfc;
 +
  text-align: center;
 +
  padding:40px 0 40px 0;
 +
  font-size:18px;
 +
  border-top:1px solid #e6e6e6;
 +
  border-bottom:1px solid #e6e6e6;
 +
}
 +
 
 +
.pricing-box.activeItem .pricing-offer{
 +
  color:#fff;
 +
}
 +
 
 +
.pricing-offer strong{
 +
  font-size:78px;
 +
  line-height:89px;
 +
}
 +
 
 +
.pricing-offer sup{
 +
  font-size:28px;
 +
}
 +
 
 +
.pricing-container{
 +
  background: #fff;
 +
  text-align:center;
 +
  font-size:14px;
 +
}
 +
 
 +
.pricing-container strong{
 +
color:#353535;
 +
}
 +
 
 +
.pricing-container ul{
 +
  list-style:none;
 +
  padding:0;
 +
  margin:0;
 +
}
 +
 
 +
.pricing-container ul li{
 +
  border-bottom: 1px solid #CFCFCF;
 +
list-style: none;
 +
padding: 15px 0 15px 0;
 +
margin: 0 0 0 0;
 +
color: #222;
 +
}
 +
 
 +
.pricing-action{
 +
  margin:0;
 +
  background: #fcfcfc;
 +
  text-align:center;
 +
  padding:20px 0 30px 0;
 +
}
 +
 
 +
.pricing-wrapp{
 +
  margin:0 auto;
 +
  width:100%;
 +
  background:#fd0000;
 +
}
 +
.pricing-box-item {border: 1px solid #e6e6e6;background:#fcfcfc;position:relative;margin:0 0 20px 0;padding:0;-webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.03);-moz-box-shadow: 0 2px 0 rgba(0,0,0,0.03);box-shadow: 0 2px 0 rgba(0,0,0,0.03);-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;overflow: hidden;}
 +
 
 +
.pricing-box-item .pricing-heading {
 +
  background: #ffffff;
 +
  text-align: center;
 +
  padding: 50px 0;
 +
  display:block;
 +
}
 +
.pricing-box-item.activeItem .pricing-heading {
 +
  /* background: #f3f3f3; */
 +
  text-align: center;
 +
  border-bottom:none;
 +
  display:block;
 +
  color:#fff;
 +
}
 +
.pricing-box-item.activeItem .pricing-heading h3 {
 +
 
 +
color: #fff;
 +
}
 +
 
 +
.pricing-box-item .pricing-heading h3 strong {
 +
  font-size:28px;
 +
  font-weight:700;
 +
  letter-spacing:-1px;
 +
  color: #05142b;
 +
}
 +
.pricing-box-item .pricing-heading h3 {
 +
  font-size:32px;
 +
  font-weight:300;
 +
  letter-spacing:-1px;
 +
}
 +
 
 +
.pricing-box-item .pricing-terms {
 +
  text-align: center;
 +
  background: #fff;
 +
  display: block;
 +
  overflow: hidden;
 +
  padding: 11px 0 5px;
 +
  /* border-top: 2px solid #BBBBBB; */
 +
  border-bottom: 2px dotted #CDCDCD;
 +
}
 +
 
 +
.pricing-box-item .pricing-terms  h6 {
 +
  margin-top: 16px;
 +
  color: #ff5722;
 +
  font-size: 22px;
 +
}
 +
 
 +
.pricing-box-item .icon .price-circled {
 +
    margin: 10px 10px 10px 0;
 +
    display: inline-block !important;
 +
    text-align: center !important;
 +
    color: #fff;
 +
    width: 68px;
 +
    height: 68px;
 +
  padding:12px;
 +
    font-size: 16px;
 +
  font-weight:700;
 +
    line-height: 68px;
 +
    text-shadow:none;
 +
    cursor: pointer;
 +
    background-color: #888;
 +
    border-radius: 64px;
 +
    -moz-border-radius: 64px;
 +
    -webkit-border-radius: 64px;
 +
}
 +
 
 +
.pricing-box-item  .pricing-action{
 +
  margin:0;
 +
  text-align:center;
 +
  padding:30px 0 30px 0;
 +
}
 +
.pricing-action .btn{
 +
  background: #ff5722;
 +
  color: #fff;
 +
}
 +
.menuItem .menu{font-size:20px;font-weight:600;list-style:none;padding:0 0 15px;margin-bottom:20px;display:inline-block;color: #e91e63;}
 +
.menuItem .menu li{padding: 16px 30px 0px;margin-bottom: 0;display:inline-block;width:100%;float:left;background: #ffffff;line-height: 30px;border-left: 2px solid #e91e63;border-radius: 0;}
 +
.menuItem .detail{
 +
font-size:13px;
 +
color:#444;
 +
font-weight:normal;
 +
}
 +
.menuItem .price{
 +
font-size:13px;
 +
float:right;
 +
font-weight:600;
 +
}
 +
/* Testimonials */
 +
.testimonials blockquote {
 +
    background: #ffffff none repeat scroll 0 0;
 +
    border: medium none;
 +
    color: #666;
 +
    display: block;
 +
    font-size: 13px;
 +
    line-height: 20px;
 +
    padding: 15px;
 +
    position: relative;
 +
}
 +
.testimonials blockquote::before {
 +
    width: 0;
 +
    height: 0;
 +
  right: 0;
 +
  bottom: 0;
 +
  content: " ";
 +
  display: block;
 +
  position: absolute;
 +
    border-bottom: 20px solid #fff;   
 +
  border-right: 0 solid transparent;
 +
  border-left: 15px solid transparent;
 +
  border-left-style: inset; /*FF fixes*/
 +
  border-bottom-style: inset; /*FF fixes*/
 +
}
 +
.testimonials blockquote::after {
 +
    width: 0;
 +
    height: 0;
 +
    right: 0;
 +
    bottom: 0;
 +
    content: " ";
 +
    display: block;
 +
    position: absolute;
 +
    border-style: solid;
 +
    border-width: 20px 20px 0 0;
 +
    border-color: #c5c5c5 transparent transparent transparent;
 +
}
 +
.testimonials .carousel-info img {
 +
    border: 1px solid #cccccc;
 +
    border-radius: 150px !important;
 +
    height: 75px;
 +
    padding: 3px;
 +
    width: 75px;
 +
}
 +
.testimonials .carousel-info {
 +
    overflow: hidden;
 +
}
 +
.testimonials .carousel-info img {
 +
    margin-right: 15px;
 +
}
 +
.testimonials .carousel-info span {
 +
    display: block;
 +
}
 +
.testimonials span.testimonials-name {
 +
    color: #e91e63;
 +
    font-size: 16px;
 +
    font-weight: 300;
 +
    margin: 23px 0 7px;
 +
}
 +
.testimonials span.testimonials-post {
 +
    color: #656565;
 +
    font-size: 12px;
 +
}
 +
/* ===== Widgets ===== */
 +
 
 +
/* --- flickr --- */
 +
.widget .flickr_badge {
 +
  width:100%;
 +
}
 +
.widget .flickr_badge img { margin: 0 9px 20px 0; }
 +
 
 +
footer .widget .flickr_badge {
 +
    width: 100%;
 +
}
 +
footer .widget .flickr_badge img {
 +
    margin: 0 9px 20px 0;
 +
}
 +
 
 +
.flickr_badge img {
 +
    width: 50px;
 +
    height: 50px;
 +
    float: left;
 +
  margin: 0 9px 20px 0;
 +
}
 +
 +
/* --- Recent post widget --- */
 +
 
 +
.recent-post{
 +
  margin:20px 0 0 0;
 +
  padding:0;
 +
  line-height:18px;
 +
}
 +
 
 +
.recent-post h5 a:hover {
 +
  text-decoration:none;
 +
}
 +
 
 +
.recent-post .text h5 a {
 +
  color:#353535;
 +
}
 +
 
 +
 
 +
footer{
 +
  padding:50px 0 0 0;
 +
  color:#f8f8f8;
 +
}
 +
 
 +
footer a {
 +
  color:#fff;
 +
}
 +
 
 +
footer a:hover {
 +
  color: #e91e63;
 +
}
 +
 
 +
footer h1, footer h2, footer h3, footer h4, footer h5, footer h6{
 +
  color: #d3d3d3;
 +
}
 +
 
 +
footer address {
 +
  line-height:1.6em;
 +
  color: #797979;
 +
}
 +
 
 +
footer h5 a:hover, footer a:hover {
 +
  text-decoration:none;
 +
}
 +
 
 +
ul.social-network {
 +
  list-style:none;
 +
  margin: 4px 0 0 -25px;
 +
}
 +
 
 +
ul.social-network li {
 +
  display:inline;
 +
  margin: 0 5px;
 +
  /* border: 1px solid #2D2D2D; */
 +
  padding: 5px 0 0;
 +
  width: 32px;
 +
  display: inline-block;
 +
  text-align: center;
 +
  height: 32px;
 +
  vertical-align: baseline;
 +
}
 +
 
 +
#sub-footer{
 +
  text-shadow:none;
 +
  color: #dedede;
 +
  padding:0;
 +
  padding-top:30px;
 +
  margin:20px 0 0 0;
 +
  background: #0a0a0a;
 +
  border-top: 1px solid #3e3e3e;
 +
}
 +
 
 +
#sub-footer p{
 +
  margin:0;
 +
  padding:0;
 +
}
 +
 
 +
#sub-footer span{
 +
  color: #9e9e9e;
 +
}
 +
 
 +
.copyright {
 +
  text-align:left;
 +
  font-size:12px;
 +
}
 +
 
 +
#sub-footer ul.social-network {
 +
  float:right;
 +
}
 +
 
 +
 
 +
 
 +
/* scroll to top */
 +
.scrollup{
 +
    position:fixed;
 +
    width:32px;
 +
    height:32px;
 +
    bottom:0px;
 +
    right:20px;
 +
    background: #e91e63;
 +
}
 +
 
 +
a.scrollup {
 +
  outline:0;
 +
  text-align: center;
 +
}
 +
 
 +
a.scrollup:hover,a.scrollup:active,a.scrollup:focus {
 +
  opacity:1;
 +
  text-decoration:none;
 +
}
 +
a.scrollup i {
 +
  margin-top: 10px;
 +
  color: #fff;
 +
}
 +
a.scrollup i:hover {
 +
  text-decoration:none;
 +
}
 +
 
 +
 
 +
 
 +
 +
.absolute{
 +
  position:absolute;
 +
}
 +
 
 +
.relative{
 +
  position:relative;
 +
}
 +
 
 +
.aligncenter{
 +
  text-align:center;
 +
}
 +
 
 +
.aligncenter span{
 +
  margin-left:0;
 +
}
 +
 
 +
.floatright {
 +
  float:right;
 +
}
 +
 
 +
.floatleft {
 +
  float:left;
 +
}
 +
 
 +
.floatnone {
 +
  float:none;
 +
}
 +
 
 +
.aligncenter {
 +
  text-align:center;
 +
}
 +
 +
img.pull-left, .align-left{
 +
  float:left;
 +
  margin:0 15px 15px 0;
 +
}
 +
 
 +
.widget img.pull-left {
 +
  float:left;
 +
  margin:0 15px 15px 0;
 +
}
 +
 
 +
img.pull-right, .align-right {
 +
  float:right;
 +
  margin:0 0 15px 15px;
 +
}
 +
 
 +
article img.pull-left, article .align-left{
 +
  float:left;
 +
  margin:5px 15px 15px 0;
 +
}
 +
 
 +
article img.pull-right, article .align-right{
 +
  float:right;
 +
  margin:5px 0 15px 15px;
 +
}
 +
============================= */
 +
 
 +
.clear-marginbot{
 +
  margin-bottom:0;
 +
}
 +
 
 +
.marginbot10{
 +
  margin-bottom:10px;
 +
}
 +
.marginbot20{
 +
  margin-bottom:20px;
 +
}
 +
.marginbot30{
 +
  margin-bottom:30px;
 +
}
 +
.marginbot40{
 +
  margin-bottom:40px;
 +
}
 +
 
 +
.clear-margintop{
 +
  margin-top:0;
 +
}
 +
 
 +
.margintop10{
 +
  margin-top:10px;
 +
}
 +
 
 +
.margintop20{
 +
  margin-top:20px;
 +
}
 +
 
 +
.margintop30{
 +
  margin-top:30px;
 +
}
 +
 
 +
.margintop40{
 +
  margin-top:40px;
 +
}
 +
.flex-control-paging li a {
 +
  width: 14px;
 +
  height: 14px;
 +
  border-radius: 50%;
 +
  background: #ffffff;
 +
  text-indent: 50px;
 +
  overflow: hidden;
 +
}
 +
.btn:hover, .btn:focus {
 +
  color: #FFF;
 +
  text-decoration: none;
 +
  background: #d41a59;
 +
  border-color: #d41a59;
 +
}
 +
/*  Media queries
 +
============================= */
 +
 
 +
@media (min-width: 768px) and (max-width: 979px) {
 +
 
 +
  a.detail{
 +
    background:none;
 +
    width:100%;
 +
  }
 +
 
 +
header  .navbar-nav > li > a{
 +
 
 +
}
 +
 
 +
  footer .widget form  input#appendedInputButton {
 +
      display: block;
 +
      width: 91%;
 +
      -webkit-border-radius: 4px 4px 4px 4px;
 +
      -moz-border-radius: 4px 4px 4px 4px;
 +
          border-radius: 4px 4px 4px 4px;
 +
  }
 +
 
 +
  footer .widget form  .input-append .btn {
 +
      display: block;
 +
      width: 100%;
 +
      padding-right: 0;
 +
      padding-left: 0;
 +
      -webkit-box-sizing: border-box;
 +
      -moz-box-sizing: border-box;
 +
          box-sizing: border-box;
 +
          margin-top:10px;
 +
  }
 +
 
 +
  ul.related-folio li{
 +
    width:156px;
 +
    margin:0 20px 0 0;
 +
  }
 +
}
 +
 
 +
@media (max-width: 767px) {
 +
.navbar-default .navbar-collapse{border-color: none;/* background: #05142b; */}
 +
.navbar-default .navbar-toggle .icon-bar {background-color: #868686;border-radius: 0;}
 +
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
 +
background-color: rgba(221, 221, 221, 0);
 +
}
 +
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
 +
border-color: rgba(255, 255, 255, 0.58);
 +
margin-top: 15px;
 +
}
 +
.flex-caption h3{
 +
  font-size:28px;
 +
}
 +
  body {
 +
    padding-right: 0;
 +
    padding-left: 0;
 +
  }
 +
  .navbar-brand {
 +
    margin-top: 18px;
 +
    border-bottom: none;
 +
  }
 +
  .navbar-header {
 +
    /* margin-top: 20px; */
 +
    border-bottom: none;
 +
  }
 +
 
 +
  .navbar-nav {
 +
    border-top: none;
 +
    float: none;
 +
    width: 100%;
 +
  }
 +
.navbar .nav > .active > a, .navbar .nav > .active > a:hover {background: none;font-weight: 700;color: #10cdff;}
 +
  header .navbar-nav > li {padding-bottom: 0;padding-top: 0;}
 +
  header .nav li .dropdown-menu  {
 +
    margin-top: 0;
 +
  }
 +
header  .navbar-nav > li > a{
 +
  line-height: 20px;
 +
}
 +
  .dropdown-menu {
 +
    position: absolute;
 +
    top: 0;
 +
    left: 40px;
 +
    z-index: 1000;
 +
    display: none;
 +
    float: left;
 +
    min-width: 160px;
 +
    padding: 5px 0;
 +
    margin: 2px 0 0;
 +
    font-size: 13px;
 +
    list-style: none;
 +
    background-color: #fff;
 +
    background-clip: padding-box;
 +
    border: 1px solid #f5f5f5;
 +
    border: 1px solid rgba(0, 0, 0, .15);
 +
    border-radius: 0;
 +
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
 +
        box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
 +
  }
 +
 
 +
 
 +
 
 +
  li.active  {
 +
    border: none;
 +
    overflow: hidden;
 +
    /* background: #2e8eda; */
 +
}
 +
 
 +
 
 +
  .box {
 +
    border-bottom:1px solid #e9e9e9;
 +
    padding-bottom:20px;
 +
  }
 +
 
 +
  .flexslider .slide-caption {
 +
    width: 90%;
 +
    padding: 2%;
 +
    position: absolute;
 +
    left: 0;
 +
    bottom: -40px;
 +
  }
 +
 
 +
 
 +
  #inner-headline .breadcrumb {
 +
    float:left;
 +
    clear:both;
 +
    width:100%;
 +
  }
 +
 
 +
  .breadcrumb > li {
 +
    font-size:13px;
 +
  }
 +
 
 +
 
 +
  ul.portfolio li article a i.icon-48{
 +
    width:20px;
 +
    height:20px;
 +
    font-size:16px;
 +
    line-height:20px;
 +
  }
 +
 
 +
 
 +
  .left-sidebar{
 +
    border-right:none;
 +
    padding:0 0 0 0;
 +
    border-bottom: 1px dotted #e6e6e6;
 +
    padding-bottom:10px;
 +
    margin-bottom:40px;
 +
  }
 +
 
 +
  .right-sidebar{
 +
    margin-top:30px;
 +
    border-left:none;
 +
    padding:0 0 0 0;
 +
  }
 +
 
 +
 
 +
  footer .col-lg-1, footer .col-lg-2, footer .col-lg-3, footer .col-lg-4, footer .col-lg-5, footer .col-lg-6,
 +
  footer .col-lg-7, footer .col-lg-8, footer .col-lg-9, footer .col-lg-10, footer .col-lg-11, footer .col-lg-12{
 +
    margin-bottom:20px;
 +
  }
 +
 
 +
  #sub-footer ul.social-network {
 +
    float:left;
 +
  }
 +
 
 +
 
 +
 
 +
  [class*="span"] {
 +
    margin-bottom:20px;
 +
  }
 +
 
 +
}
 +
 
 +
@media (max-width: 480px) {
 +
  .bottom-article a.pull-right {
 +
    float:left;
 +
    margin-top:20px;
 +
  }
 +
 
 +
 
 +
  .search{
 +
    float:left;
 +
  }
 +
 
 +
  .flexslider .flex-caption {
 +
    display:none;
 +
  }
 +
 
 +
 
 +
  .cta-text {
 +
    margin:0 auto;
 +
    text-align:center; 
 +
  }
 +
 
 +
  ul.portfolio li article a i{
 +
    width:20px;
 +
    height:20px;
 
     font-size:14px;
 
     font-size:14px;
−
    font-weight: 500;
+
  }
 +
 
 +
 
 
}
 
}
 +
.tab-section .col{
 +
 
 +
}
 +
.tab-section .container{
 +
  padding: 15px;
 +
  border: 1px solid #eaeaea;
 +
  background: #fff;
 +
}
 +
.active .collapsible-header{color: #e91e63;}
 +
span.color {
 +
    color: #e91e63;
 +
    text-transform: uppercase;
 +
}
 +
span.h33{
 +
    color: #e91e63;
 +
   
 +
}
 +
.input-field label {
 +
    color: #888;
 +
  font-size:14px;
 +
}
 +
.input-field {
 +
    position: relative;
 +
    margin-top: 1rem;
 +
    float: left;
 +
    width: 100%;
 +
}
 +
.alert-danger {
 +
    float: left;
 +
}
 +
 +
 +
/**********************
 +
  ****iGEM*************************************************************
 +
**************/
 +
<script>
 +
    if ($('.firstHeading')) $('.firstHeading').remove();
 +
    </script>
 +
    <style>
 +
    html {
 +
        overflow-x: hidden;
 +
        width: 100%;
 +
    }
 +
   
 +
    .banner-top {
 +
        margin-left: 15%;
 +
    }
 +
   
 +
    #igem_home_logo {
 +
        width: 100%;
 +
        margin-top: 80px;
 +
    }
 +
   
 +
    @media (min-width: 992px) {
 +
        .work-content .col-md-4 {
 +
            width: 25%;
 +
            margin-right: 8%;
 +
        }
 +
    }
 +
   
 +
    .carousel-control.left,
 +
    .carousel-control.right {
 +
        background-image: none;
 +
        padding-top: 18%;
 +
    }
 +
   
 +
    .carousel-indicators li {
 +
        background-color: #fff;
 +
        border: 1px solid #a94442;
 +
    }
 +
   
 +
    .carousel-indicators li.active {
 +
        background-color: #f0ad4e;
 +
    }
 +
   
 +
    #contentSub,
 +
    #contentcontainer,
 +
    #footer-box,
 +
    #sitesub,
 +
    #catlinks,
 +
    #search-controls,
 +
    #p-logo,
 +
    .h3,
 +
    .printfooter,
 +
    .firstHeading,
 +
    .visualClear {
 +
        display: none;
 +
        box-sizing: content-box;
 +
    }
 +
   
 +
    #sideMenu,
 +
    #top_title {
 +
        display: none;
 +
        box-sizing: content-box;
 +
    }
 +
   
 +
    #sideMenu .mainMenu_toggle,
 +
    #sideMenu .mainMenu_Title,
 +
    #sideMenu .sideMenuTitle,
 +
    #sideMenu .expand_subMenus {
 +
        box-sizing: content-box;
 +
    }
 +
   
 +
    #bodyContent h1,
 +
    #bodyContent h2,
 +
    #bodyContent h3,
 +
    #bodyContent h4,
 +
    #bodyContent h5 {
 +
        margin-bottom: 0px;
 +
    }
 +
   
 +
    #search_text {
 +
        color: #000;
 +
    }
 +
   
 +
    #globalWrapper,
 +
    #content {
 +
        position: absolute;
 +
        left: 0;
 +
        right: 0;
 +
        top: 0;
 +
        width: 100%;
 +
        height: 100%;
 +
        border: 0px;
 +
        background-color: transparent;
 +
        margin: 0px;
 +
        padding: 0px;
 +
    }
 +
   
 +
    @media (min-width: 1200px) {
 +
        .container-fluid .container {
 +
            width: 969px;
 +
            /* margin-left: 300px; */
 +
        }
 +
        .head-container {
 +
            width: 1170px;
 +
        }
 +
    }
 +
    /* article */
 +
   
 +
    .text-content article p {
 +
        text-indent: 20px;
 +
        margin: 10px 0;
 +
        font-size: 15px;
 +
        line-height: 24px;
 +
    }
 +
   
 +
    .text-content article img {
 +
        width: 80%;
 +
        padding-left: 20%;
 +
        /* margin-left: 20%; */
 +
    }
 +
    /*    .mw-content-ltr ol{
 +
        margin:0;
 +
    } */
 +
   
 +
    ol.carousel-indicators {
 +
        position: absolute;
 +
        bottom: 10px;
 +
        left: 50%;
 +
        z-index: 15;
 +
        width: 60%;
 +
        padding-left: 0;
 +
        margin-left: -30%;
 +
        text-align: center;
 +
        list-style: none;
 +
    }
 +
 +
       
 +
        @charset "utf-8";
 +
    body {
 +
        font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei UI", "Microsoft YaHei", SimHei, "\5B8B\4F53", simsun, sans-serif;
 +
        color: #666;
 +
        width:100%;
 +
    }
 +
    .logo {
 +
        padding:0;
 +
    }
 +
 +
    #myCarousel {
 +
        margin: 50px 0 0 0;
 +
    }
 +
    #navbar-collapse ul {
 +
        margin-top:0;
 +
    }
 +
    .carousel-inner img {
 +
        margin: 0 auto;
 +
    }
 +
    /*.carousel-control {
 +
        font-size: 100px;
 +
    }*/
 +
    .tab-h1 {
 +
        width:100%;
 +
        font-size: 30px;
 +
        text-align: center;
 +
        letter-spacing: 1px;
 +
        color: #ffffff;
 +
        background-color:#97477c;
 +
        padding: 30px;
 +
        margin: 0;
 +
    }
 +
 +
    .tab-p {
 +
        font-size: 20px;
 +
        text-align: center;
 +
        letter-spacing: 1px;
 +
        color: #999;
 +
        margin: 20px 0 40px 0;
 +
    }
 +
 +
    .container-fluid{
 +
        width:100%;
 +
    }
 +
 +
    .tab1 {
 +
        width:100%;
 +
        margin: 0 0;
 +
        color: #666;
 +
        background:#333;
 +
    }
 +
 +
    .tab1 .text-muted {
 +
        color: #999;
 +
        text-decoration: line-through;
 +
    }
 +
    .tab1 .media-heading {
 +
        margin: 5px 0 20px 0;
 +
    }
 +
    .tab1 .col {
 +
        padding: 20px;
 +
    }
 +
 +
    .text span{
 +
        color: #97477c;
 +
    }
 +
    .text p {
 +
        font-size: 14px;
 +
    }
 +
    #footer {
 +
        background-color: #eee;
 +
        border-top: 1px solid #ccc;
 +
        padding: 20px;
 +
        text-align: center;
 +
    }
 +
    .text h4{
 +
        padding: 5px 10px;
 +
    }
 +
    .text p{
 +
        padding: 2px 10px;
 +
    }
 +
    .text h5{
 +
        padding: 3px 10px;
 +
    }
 +
    .dropdown button{
 +
        margin: 2px 20px;
 +
    }
 +
    /*没有小于768px，是因为Bootstrap3以移动端优先设计*/
 +
 +
    /* 小屏幕（平板，大于等于768px） */
 +
    @media (min-width: 768px) {
 +
        .tab-h1 {
 +
            font-size: 26px;
 +
        }
 +
        .tab-p {
 +
            font-size: 16px;
 +
        }
 +
        .text h3 {
 +
            font-size: 22px;
 +
        }
 +
        .text p {
 +
            font-size: 10px;
 +
            text-indent: 20px;
 +
        }
 +
        .tab2-text {
 +
            float: left;
 +
        }
 +
        .tab2-img {
 +
            float: right;
 +
        }
 +
    }
 +
 +
    /* 中等屏幕（桌面显示器，大于等于992px） */
 +
    @media (min-width: 992px) {
 +
        .tab-h1 {
 +
            font-size: 28px;
 +
        }
 +
        .tab-p {
 +
            font-size: 17px;
 +
        }
 +
        .text h3 {
 +
            font-size: 24px;
 +
        }
 +
        .text p {
 +
            font-size: 12px;
 +
            text-indent: 24px;
 +
        }
 +
    }
 +
 +
    /* 大屏幕（大桌面显示器，大于等于1200px） */
 +
    @media (min-width: 1200px) {
 +
        .tab-h1 {
 +
            font-size: 30px;
 +
        }
 +
        .tab-p {
 +
            font-size: 18px;
 +
        }
 +
        .text h3 {
 +
            font-size: 26px;
 +
        }
 +
        .text p {
 +
            font-size: 14px;
 +
            text-indent: 28px;
 +
        }
 +
    }
 +
       
 +
 +
    body {
 +
            position: relative;
 +
        }
 +
        ul.nav-pills {
 +
            top: 200px;
 +
            position: fixed;
 +
        }
 +
        ul.nav-pills2 {
 +
            bottom:50px;
 +
            position: fixed;
 +
        }
 +
        div.col-sm-10 div {
 +
            min-height: 10px;
 +
            font-size: 14px;
 +
            text-indent: 28px;
 +
            color:#0f0f0f;
 +
        }
 +
 +
        @media screen and (max-width: 992px) {
 +
            #section1, #section2, #section3, #section4, #section5 {
 +
            background-color: #eee; color:#171717;
 +
            }
 +
        }
 +
 +
        body {
 +
                position: relative;
 +
            }
 +
        .menu_logo_1 {
 +
                top: 18px;
 +
                left:80px;
 +
                z-index: -1000;
 +
                opacity: 0.8;
 +
                position: fixed;
 +
        }
 +
        .menu_logo_2 {
 +
                top: 18px;
 +
                left:170px;
 +
                z-index: -1000;
 +
                opacity: 0.8;
 +
                position: fixed;
 +
        }
 +
        p{
 +
          text-indent:2em;
 +
        }
 +
    </style>
 +
 +
 +
 +
 +
 
</style>
 
</style>
 
   
 
   
Line 56: Line 2,523:
 
       <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
 
       <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
 
     <![endif]-->
 
     <![endif]-->
 +
<link rel="stylesheet" href="https://2018.igem.org/Team:HUST-China/css/menu-slider?action=raw&amp;ctype=text/css" type="text/css" />
 +
<script type="text/javascript" src="https://2018.igem.org/Team:HUST-China/js/slider-jquery?action=raw&amp;ctype=text/javascript"></script>
 +
<script type="text/javascript" src="https://2018.igem.org/Team:HUST-China/js/slider-jquery-flexslider-min?action=raw&amp;ctype=text/javascript"></script>
 
</head>
 
</head>
 
<body>
 
<body>
Line 70: Line 2,540:
 
                     </button>
 
                     </button>
 
                     <a class="navbar-brand" href="https://2018.igem.org/Team:HUST-China">
 
                     <a class="navbar-brand" href="https://2018.igem.org/Team:HUST-China">
−
                       <img style="height: 50px; width:auto;margin-top:-10px; padding:0;" src="https://static.igem.org/mediawiki/2018/c/cb/T--HUST-China--2018-menu-logo-white.png"></a>
+
                      <i class="icon-info-blocks material-icons">account_balance</i>
−
                    <a class="navbar-brand" href="https://2018.igem.org">
+
                       <img style="height: 35px; width:auto;margin:0; padding:0;" src="https://static.igem.org/mediawiki/2018/c/cb/T--HUST-China--2018-menu-logo-white.png"></a>
−
                       <img style="height: 60px; width:auto; padding:0;margin-top: -13px;" src=" https://static.igem.org/mediawiki/2018/f/f0/T--UC_Davis--igemLogo.jpg"></a>
+
                       <img style="height: 40px; width:auto; padding:0;margin-top: 20px;" src=" https://static.igem.org/mediawiki/2018/f/f0/T--UC_Davis--igemLogo.jpg"></a>
 
                 </div>
 
                 </div>
−
                <div class="navbar-collapse collapse ">
+
                <div class="navbar-collapse collapse ">
 
                     <ul class="nav navbar-nav">
 
                     <ul class="nav navbar-nav">
 
                       <li class="HillSide"><a class="waves-effect waves-dark" href="https://2018.igem.org/Team:HUST-China">Home</a></li>  
 
                       <li class="HillSide"><a class="waves-effect waves-dark" href="https://2018.igem.org/Team:HUST-China">Home</a></li>  
Line 145: Line 2,615:
 
   </section>
 
   </section>
 
   -->
 
   -->
−
   <section id="inner-headline">
+
   </section> 
−
  <div class="container">
+
  <section id="inner-headline">
−
    <div class="row">
+
            <div class="container">
−
      <div class="col-lg-12">
+
              <div class="row">
−
        <h2 class="pageTitle">Safety
+
                <div class="col-lg-12">
−
         </h2>
+
                  <h2 class="pageTitle">Human Practices</h2>
 +
                </div>
 +
              </div>
 +
            </div>
 +
          </section>
 +
          <div class="carousel">
 +
  <div class="carousel__control"> </div>
 +
  <div class="carousel__stage">
 +
    <div class="spinner spinner--left">
 +
      <div class="spinner__face js-active" data-bg="#27323c">
 +
         <div class="content" data-type="carousel-1">
 +
          <div class="content__left">
 +
            <h1><br>
 +
              <span></span></h1>
 +
          </div>
 +
         
 +
          <div class="content__right">
 +
            <div style="font-size: 28px;color: white;line-height: 30px;padding: 10px;text-align: left;">
 +
              <p>The technical director of Shenglong Electric told us that the biggest limitation to the construction of photovoltaic power plants is natural conditions.</p>
 +
            </div>
 +
            <h3 class="content__index">01</h3>
 +
          </div>
 +
        </div>
 +
      </div>
 +
      <div class="spinner__face" data-bg="#19304a">
 +
        <div class="content" data-type="carousel-2">
 +
          <div class="content__left">
 +
            <h1><br>
 +
              <span></span></h1>
 +
          </div>
 +
          <div class="content__right">
 +
          <div style="font-size: 28px;color: white;line-height: 30px;padding: 10px;text-align: left;">
 +
              <p>Representatives from Hiconics Drived Technology Co. (Wuhan) told us the pollution is unavoidable during the solar panels manufacturing and disposing.</p>
 +
          </div>
 +
            <h3 class="content__index">02</h3>
 +
          </div>
 +
        </div>
 +
      </div>
 +
      <div class="spinner__face" data-bg="#2b2533">
 +
        <div class="content" data-type="carousel-3">
 +
          <div class="content__left">
 +
            <h1><br>
 +
              <span></span></h1>
 +
          </div>
 +
          <div class="content__right">
 +
            <div style="font-size: 28px;color: white;line-height: 30px;padding: 10px;text-align: left;">
 +
              <p>Professor Zhu Zhiguang and our team members discussed about the current international market of bio-power generation and the problems to be solved in bio-electricity industrialization</p>
 +
            </div>
 +
            <h3 class="content__index">03</h3>
 +
          </div>
 +
        </div>
 +
      </div>
 +
      <div class="spinner__face" data-bg="#312f2d">
 +
        <div class="content" data-type="carousel-4">
 +
          <div class="content__left">
 +
            <h1><br>
 +
              <span></span></h1>
 +
          </div>
 +
          <div class="content__right">
 +
            <div style="font-size: 28px;color: white;line-height: 30px;padding: 10px;text-align: left;">
 +
              <p>Professor Zhou Yinhua gave a professional explanation to make us a understanding solar energy even further.</p>
 +
            </div>
 +
            <h3 class="content__index">04</h3>
 +
          </div>
 +
        </div>
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
   </div>
 
   </div>
−
  </section>
+
</div>
  
−
  <section class="content">
+
<!--  Poor man's preloader -->
−
  <div class="container">
+
<div style="height: 0; width: 0; overflow: hidden"> <img src="https://unsplash.it/1600/1800/?random"> <img src="https://unsplash.it/1601/1800/?random"><img src="https://unsplash.it/1602/1800/?random"><img src="https://unsplash.it/1603/1800/?random"><img src="https://unsplash.it/1604/1800/?random"></div>
−
        <div class="row">  
+
<script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>  
−
          <div class="col-md-12 content-text">
+
<script>
−
                <div class="about-logo">
+
'use strict';
−
                 
+
var activeIndex = 0;
−
                  <p>For practical projects, especially involving synthetic biology, safety should be attached great importance to. This year, we designed an electricity generation device based on microbial co-culture. In terms of experimental design, experimental operation and so on, we fully considered their safety and implement safety at every step. </p>
+
var limit = 0;
−
 
+
var disabled = false;
−
                </div>
+
var $stage = undefined;
 +
var $controls = undefined;
 +
var canvas = false;
 +
var SPIN_FORWARD_CLASS = 'js-spin-fwd';
 +
var SPIN_BACKWARD_CLASS = 'js-spin-bwd';
 +
var DISABLE_TRANSITIONS_CLASS = 'js-transitions-disabled';
 +
var SPIN_DUR = 1000;
 +
var appendControls = function appendControls() {
 +
    for (var i = 0; i < limit; i++) {
 +
        $('.carousel__control').append('<a href="#" data-index="' + i + '"></a>');
 +
    }
 +
    var height = $('.carousel__control').children().last().outerHeight();
 +
    $('.carousel__control').css('height', 30 + limit * height);
 +
    $controls = $('.carousel__control').children();
 +
    $controls.eq(activeIndex).addClass('active');
 +
};
 +
var setIndexes = function setIndexes() {
 +
    $('.spinner').children().each(function (i, el) {
 +
        $(el).attr('data-index', i);
 +
        limit++;
 +
    });
 +
};
 +
var duplicateSpinner = function duplicateSpinner() {
 +
    var $el = $('.spinner').parent();
 +
    var html = $('.spinner').parent().html();
 +
    $el.append(html);
 +
    $('.spinner').last().addClass('spinner--right');
 +
    $('.spinner--right').removeClass('spinner--left');
 +
};
 +
var paintFaces = function paintFaces() {
 +
    $('.spinner__face').each(function (i, el) {
 +
        var $el = $(el);
 +
        var color = $(el).attr('data-bg');
 +
        $el.children().css('backgroundImage', 'url(' + getBase64PixelByColor(color) + ')');
 +
    });
 +
};
 +
var getBase64PixelByColor = function getBase64PixelByColor(hex) {
 +
    if (!canvas) {
 +
        canvas = document.createElement('canvas');
 +
        canvas.height = 1;
 +
        canvas.width = 1;
 +
    }
 +
    if (canvas.getContext) {
 +
        var ctx = canvas.getContext('2d');
 +
        ctx.fillStyle = hex;
 +
        ctx.fillRect(0, 0, 1, 1);
 +
        return canvas.toDataURL();
 +
    }
 +
    return false;
 +
};
 +
var prepareDom = function prepareDom() {
 +
    setIndexes();
 +
    paintFaces();
 +
    duplicateSpinner();
 +
    appendControls();
 +
};
 +
var spin = function spin() {
 +
    var inc = arguments.length <= 0 || arguments[0] === undefined ? 1 : arguments[0];
 +
    if (disabled)
 +
        return;
 +
    if (!inc)
 +
        return;
 +
    activeIndex += inc;
 +
    disabled = true;
 +
    if (activeIndex >= limit) {
 +
        activeIndex = 0;
 +
    }
 +
    if (activeIndex < 0) {
 +
        activeIndex = limit - 1;
 +
    }
 +
    var $activeEls = $('.spinner__face.js-active');
 +
    var $nextEls = $('.spinner__face[data-index=' + activeIndex + ']');
 +
    $nextEls.addClass('js-next');
 +
    if (inc > 0) {
 +
        $stage.addClass(SPIN_FORWARD_CLASS);
 +
    } else {
 +
        $stage.addClass(SPIN_BACKWARD_CLASS);
 +
    }
 +
    $controls.removeClass('active');
 +
    $controls.eq(activeIndex).addClass('active');
 +
    setTimeout(function () {
 +
        spinCallback(inc);
 +
    }, SPIN_DUR, inc);
 +
};
 +
var spinCallback = function spinCallback(inc) {
 +
    $('.js-active').removeClass('js-active');
 +
    $('.js-next').removeClass('js-next').addClass('js-active');
 +
    $stage.addClass(DISABLE_TRANSITIONS_CLASS).removeClass(SPIN_FORWARD_CLASS).removeClass(SPIN_BACKWARD_CLASS);
 +
    $('.js-active').each(function (i, el) {
 +
        var $el = $(el);
 +
        $el.prependTo($el.parent());
 +
    });
 +
    setTimeout(function () {
 +
        $stage.removeClass(DISABLE_TRANSITIONS_CLASS);
 +
        disabled = false;
 +
    }, 100);
 +
};
 +
var attachListeners = function attachListeners() {
 +
    document.onkeyup = function (e) {
 +
        switch (e.keyCode) {
 +
        case 38:
 +
            spin(-1);
 +
            break;
 +
        case 40:
 +
            spin(1);
 +
            break;
 +
        }
 +
    };
 +
    $controls.on('click', function (e) {
 +
        e.preventDefault();
 +
        if (disabled)
 +
            return;
 +
        var $el = $(e.target);
 +
        var toIndex = parseInt($el.attr('data-index'), 10);
 +
        spin(toIndex - activeIndex);
 +
    });
 +
};
 +
var assignEls = function assignEls() {
 +
    $stage = $('.carousel__stage');
 +
};
 +
var init = function init() {
 +
    assignEls();
 +
    prepareDom();
 +
    attachListeners();
 +
};
 +
$(function () {
 +
    init();
 +
});
 +
</script>
 +
       
 +
    <div class="container">
 +
      <div class="row">
 +
          <div class="container">
 +
              <div class="row">
 +
             
 +
              </div>
 
             </div>
 
             </div>
−
            <div class="col-md-12 content-text">
+
        <div class="col-md-12">
−
                <div class="about-logo">
+
          <h3 class="color"> <span class="h33">A communication with our professors</span></h3>
−
                  <h3><strong>1. <span class="red-content">Safe Project Design</span></strong></h3>
+
−
                  <p>Safe strains and safe gene products were selected to complete our project design. The products of the genes transferred into the microorganisms are all determined and do not cause any known diseases to humans, animals and plants. Any microorganisms involved in our project is encapsulate in electricity generation device. So far, the devise can recharge the phone, and in the future, electricity generation based on microbial co-culture may become a new choice of electricity production.</p>
+
−
                  <div style="padding:3px 10px;">
+
−
                  <h4><strong>a. Rhodopseudomonas palustris</strong></h4>
+
−
                  <p>Rhodopseudomonas palustris(DSM5859) is one of the protagonists in our project. It is responsible for converting optical energy into chemical energy with lactic acid producing and secreting lactic acid for the electricity production of Shewanella. Rhodopseudomonas palustris is commonly used in sewage treatment. It is a kind of microorganism being harmless to the human body and environmentally friendly. </p>
+
 
                   </div>
 
                   </div>
−
                  <div style="padding:3px 10px;">
+
            <div class="container">
−
                  <h4><strong>b.Cyanobacteria</strong></h4>
+
              <div class="row">
−
                  <p>In our project, cyanobacteria are used as a control strain to compare the electricity production efficiency of Shewanella when cyanobacteria and Rhodopseudomonas palustris are respectively co-cultured with Shewanella. The cyanobacteria selected is Synechocystis sp. PCC6803, which is widely used in algae research as a model organism. Because of its long growth cycle, strict growth conditions, and special culture medium, we can control its growth in many ways to avoid pollution.</p>
+
              </div>
 +
            </div>
 +
         
 +
        <div class="col-md-12">
 +
         
 +
        <P>In the initial project design, we hope to co-culture cyanobacteria and Shewanella to build a bio-power producing system. Cyanobacteria could utilize solar energy to produce lactate, which can be the carbon source of Shewanella. Then, Shewanella could produce electricity. However, during the discussion, Professor Yunjun Yan pointed out a serious problem. Cyanobacteria would inevitably produce oxygen during photosynthesis, and Shewanella's electrogenesis relies on an anaerobic environment. This contradiction will make the system we build unstable and cannot work efficiently and continuously.
 +
We started to search for another kind of photosynthetic bacteria. After some effort, we finally chose Rhodopseudomonas palustris. This kind of bacteria can not only carry out photosynthesis without restricting the growth of Shewanella, but use sodium acetate as a energy source for growth. Sodium acetate is a metabolite of Shewanella after using lactate. Based on all these facts, Rhodopseudomonas palustris is a really great “teammate” to work with shewanella.  
 +
After we set up the project, we try to make the project more related to social production and life. We decided to cater to China's energy transformation strategy and provide a new idea for utilization of solar energy. We communicate the experts of this field to know more about the concerns and requirements from the society, thus guiding our project to work in a more efficient way. </P>
 +
        </div>
 +
        <div class="container">
 +
              <div class="row">
 +
              </div>
 +
            </div>
 +
            <div class="col-md-12">
 +
          <h3 class="color"> <span class="h33">Investiation on Electric Company</span></h3>
 
                   </div>
 
                   </div>
−
                  <div style="padding:3px 10px;">
+
            <div class="container">
−
                  <h4><strong>c. Shewanella</strong></h4>
+
              <div class="row">
−
                  <p>Shewanella is the key species for optical energy conversion, which can consume lactate and reduce metal to produce electricity. The Shewanella oneidensis MR-1 we used can be used for wastewater treatment [1]. For the time being, there are no reports of diseases with it. </p>
+
              </div>
−
                  </div>
+
−
                </div>
+
 
             </div>
 
             </div>
 +
         
 +
        <div class="col-md-12">
 +
          <div class="about-text">
 +
           
 
              
 
              
−
         
+
            <p>We took a visit to Shenglong Electric and Hiconics Drived Technology Co. These two companies mainly focus on producing electrical energy and designing more efficient solar panels. Workers over there gave us some information about the current status and future development direction of electrical industries. They also put forward some valuable opinions on our projects in many directions, such as portability, environmental protection and marketability. </p>
−
             
+
          </div>
−
           
+
        </div>
  
−
             <div class="col-md-12 content-text">
+
       
−
                <div class="about-logo">
+
             <div class="col-md-12 content-text"style="padding:5px 10px;">  
−
                  <h3><strong>2. <span class="red-content">Safe Lab Work</span></strong></h3>
+
             
−
                  <p>Our team also pay special attention to safety issues during the experimental operation. New members are required to undergo experimental training from Principle Investigators, graduate students and previous team members in our lab before conducting experiments. Experimental training includes standard experiment operations, safety regulations of equipment usage and good practice rules in the polluted area. In addition, undergraduates have to use secondary equipment with company of a graduate student. In our project, microbial co-culture used to generate electricity must be sterilized at 121 ℃ for 25 minutes before disposal. Based on previous experience, we highlight the following points in experimental safety:</p>
+
                <h4> <span class="red-content">A Visit to Shenglong Electric </span></h4>
−
                  <p>1.polluted area must be isolated from the nomal bench. Experimenters are required to wear lab coat and polyvinyl chloride plastic gloves before entering.</p>
+
               
−
                  <p>2.Toxic reagents must be collected specially.</p>
+
                    <p>
−
                  <p>3.Volatile chemicals involved experiment must be operated in the fuming cupboard.</p>  
+
                      Shenglong Electric is one of the leading manufacturer of power transmission and distribution equipment in China. Shenglong Electric's business covers all provinces and cities in China and more than 20 countries overseas. We visited the company on August 9, 2018 and made an interview to their technical director. He mentioned that the biggest limitation to the construction of photovoltaic power plants is natural conditions. There is no suitable large-scale land to build solar power stations in the eastern regions in China. However, the electricity consumption in this area is really high. It will be a good idea that we use bacteria, a system at a really small scale to produce enough electric energy to solve the land limitation problem. In addition, when exposed to light, Rhodopseudomonas pallidum absorbs light energy and stores it in the negative electrode chamber in form of lactate. When the light is off, even if the lactate in the negative electrode chamber is consumed, its content does not change abruptly. That means the microbial fuel cell also has a certain energy storage function, which can continuously supply power, so the problem that solar power generation cannot be continuously powered on cloudy days and nights can be solved.  
−
                  <p>4.Laboratory appliance must be sterilized before and after use.</p>
+
                  </p>
−
                  <p>5.Maintaing of complex equipment must be in the charge of staff.</p>
+
                  </div>
−
                           
+
                    <div class="col-md-12 content-text"style="padding:5px 10px;">  
−
                </div>
+
             
 +
                <h4>A Visit to Hiconics Drived Technology Co. (Wuhan) </h4>
 +
               
 +
                    <p>
 +
                      On August 15, 2018, we visited Hiconics Drived Technology Co. (Wuhan). This company’s products mainly focus on equipment manufacturing and high-tech industries with high-end manufacturing of energy-saving equipment, new energy vehicles and environmental protection. Representatives from the company took us visit the new energy vehicles, solar charging sheds, charging piles and charging stations they designed. They told us many things about the development of solar energy in our country, the national policy of new energy generation and the main problems exists at present, such as the recycling and reuse of solar panels made of monocrystalline and polycrystalline silicon and the impact of secondary pollution. We still need to pay more attention to the by-product of our “Optopia” to avoid the pollution. Because we are still working at a small scale, the pollution cannot be detected. We are going to do experiments at a larger scale to see its impact on the environment if possible.
 +
                  </p>
 +
                  </div>
 +
               
 +
           
 +
                  <div class="container">
 +
              <div class="row">
 +
              </div>
 
             </div>
 
             </div>
−
 
+
            <div class="col-md-12">
−
            <div class="col-md-12 content-text">
+
          <h3 class="color"> <span class="h33">Communicate with the professors</span></h3>
−
                <div class="about-logo">
+
                  </div>
−
                  <h3><strong>3. <span class="red-content">Safe Shipment</span></strong></h3>
+
            <div class="container">
−
                  <p>Safety is also important when sending parts to the registry. All materials sent must be frozen dried and the sealed 96-well plate must wrapped with enough bubble paper to prevent breaking. Sometimes the DNA delivery will be checked by customs, so we have prepared safety certification to ensure that the materials are harmless. Packaging and delivery are done in accordance with the requirements of the courier company and iGEM HQ.
+
              <div class="row">
−
</p>
+
              </div>
−
                </div>
+
 
             </div>
 
             </div>
−
             <div class="container">
+
         
−
        <div class="row">
+
     
−
         </div>
+
 
 +
       
 +
             <div class="col-md-12 content-text"style="padding:5px 10px;">  
 +
             
 +
                <h4>An Interview to Professor Zhiguang Zhu from Tianjin Industrial Biology Institute</h4>
 +
               
 +
                    <p>
 +
                    We are really lucky to get the opportunity to interview Professor Zhiguang Zhu, a professor who studies biomass fuel cells based on multi-enzyme catalysis. We gave Prof. Zhu a detailed introduction to the synthetic biology knowledge related to our project and asked about the feasibility of our project ideas. Prof. Zhu highly recognized our project and further discussed with the team members about the possible content of bio-batteries. After that, Professor Zhu and our team members discussed about the current international market of bio-power generation and the problems to be solved in bio-electricity industrialization, which inspired our team members about the practical application of bio-generation. He also gave some suggestions to our project. For example, we are now simply mixing the 2 kinds of bacteria together, but this may lead to a greater internal electronic resistance. Moreover, as Rhodopseudomonas palustris can transfer solar energy into lactate, we can use this part to do something else such as medical production. This interview not only gave us a further understanding of our projects, but also broadened our horizons and gave us an insight into the global status of bio-generators.
 +
                  </p>
 +
                  </div>
 +
                    <div class="col-md-12 content-text"style="padding:5px 10px;">  
 +
             
 +
                <h4>An Interview with Professor Zhou Yinhua of Wuhan National Research Center for Optoelectronics </h4>
 +
               
 +
                    <p>
 +
                      Professor Zhou Yinhua from the National Research Center for Optoelectronics of Huazhong University of Science and Technology is mainly involved in the research of organic/polymer semiconductor energy devices. During the conversation with Professor Zhou, he gave a professional explanation to make us a understanding solar energy even further. After that, Professor Zhou explained to us in detail the advantages of solar energy projects. Our team members exchanged our ideas with Professor Zhou on the current situation of solar energy and market prospect. This conversation taught us a lot of biological knowledge that we did not learn in the past, and also pointed out new directions for our future science and technology. He pointed out several problems existed nowadays in solar energy projects, such as the obstacles between the application of solar energy projects and real life, the commercialization of solar energy, the cost and so on. Therefore, we will take these issues into consideration and try to solve them through our project.
 +
                  </p>
 +
                  </div>
 +
               
 +
           
 +
                 
 +
          
 +
 
 +
             
 +
                 
 +
                 
 +
                 
 +
        </div>   
 +
      </div>
 +
      </div>
 
       </div>
 
       </div>
−
            <h4><strong>Reference </strong></h4>
+
    </div>
−
          <p> <span>[1] Xiang Xiao, Xiao-Bo Ma, Hang Yuan. Peng-Cheng Liu, Yu-Bin Kei, Hui Xu, Dao-Lin Du, Jian-Fan Sun, Yu-Jie Feng. Photocatalytic properties of zinc sulfide nanocrystals biofabricated by metal-reducing bacterium Shewanella oneidensis MR-1. Journal of Hazardous Materials. 2015, 288: 134~139.</span></p>
+
   </section>
−
        </div>            
+
 
−
   </div>
+
−
</section>
+
−
+
−
 
+
 
   
 
   
 
   <footer>
 
   <footer>
 +
    <!--
 +
  <div class="container">
 +
    <div class="row">
 +
      <div class="col-sm-4">
 +
        <div class="widget">
 +
          <h5 class="widgetheading">Our Contact</h5>
 +
          <div  style="font-size: 14px;">
 +
            <address>
 +
              College of Life Science & Technology<br>
 +
              Huazhong University of Science and Technology<br>
 +
              Add: 1037 Luoyu Road, Wuhan, Hubei, China;<br>
 +
              P.C: 430074<br>
 +
            </address>
 +
            <p>
 +
              <i class="icon-phone"></i> (86) 027-87792270 <br>
 +
              <i class="icon-envelope-alt"></i> zhanyi@hust.edu.cn
 +
            </p>
 +
          </div>
 +
        </div>
 +
      </div>
 +
      <div class="col-sm-4">
 +
        <div class="widget">
 +
          <h5 class="widgetheading">Quick Links</h5>
 +
          <ul class="link-list">
 +
            <li><a class="waves-effect waves-dark" href="#">Latest Events</a></li>
 +
            <li><a class="waves-effect waves-dark" href="#">Terms and conditions</a></li>
 +
            <li><a class="waves-effect waves-dark" href="#">Privacy policy</a></li>
 +
            <li><a class="waves-effect waves-dark" href="#">Career</a></li>
 +
            <li><a class="waves-effect waves-dark" href="#">Contact us</a></li>
 +
          </ul>
 +
        </div>
 +
      </div>
 +
      <div class="col-sm-4">
 +
        <div class="widget">
 +
          <h5 class="widgetheading">Latest posts</h5>
 +
          <ul class="link-list">
 +
            <li><a class="waves-effect waves-dark" href="#">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</a></li>
 +
            <li><a class="waves-effect waves-dark" href="#">Pellentesque et pulvinar enim. Quisque at tempor ligula</a></li>
 +
            <li><a class="waves-effect waves-dark" href="#">Natus error sit voluptatem accusantium doloremque</a></li>
 +
          </ul>
 +
        </div>
 +
      </div>
 +
    </div>
 +
  </div> 
 +
-->
 
     <div class="container" >
 
     <div class="container" >
 
       <div class="row">
 
       <div class="row">
Line 231: Line 2,991:
 
                 Copyright &copy;2018 Huazhong University of Science & Technology. Produced By </span><a href="https://2018.igem.org/Team:HUST-China" target="_blank" style="color:white;">HUST-China</a>
 
                 Copyright &copy;2018 Huazhong University of Science & Technology. Produced By </span><a href="https://2018.igem.org/Team:HUST-China" target="_blank" style="color:white;">HUST-China</a>
 
           </div>   
 
           </div>   
 +
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
   </footer>
 
   </footer>
 
</div>
 
</div>
−
<a href="#" class="scrollup waves-effect waves-dark"><img class="img-responsive" src="https://static.igem.org/mediawiki/2018/7/79/T--HUST-China--2018-menu-return-top.png"></a>
 
 
<!-- javascript
 
<!-- javascript
 
     ================================================== -->
 
     ================================================== -->
Line 243: Line 3,003:
 
<script src="https://2018.igem.org/Team:HUST-China/materialize/js/materialize-min?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2018.igem.org/Team:HUST-China/materialize/js/materialize-min?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2018.igem.org/Team:HUST-China/js/bootstrap-min?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2018.igem.org/Team:HUST-China/js/bootstrap-min?action=raw&amp;ctype=text/javascript"></script>
−
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
 
 
<script src="https://2018.igem.org/Team:HUST-China/js/jquery-fancybox-pack?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2018.igem.org/Team:HUST-China/js/jquery-fancybox-pack?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2018.igem.org/Team:HUST-China/js/jquery-fancybox-media?action=raw&amp;ctype=text/javascript"></script>   
 
<script src="https://2018.igem.org/Team:HUST-China/js/jquery-fancybox-media?action=raw&amp;ctype=text/javascript"></script>   
Line 250: Line 3,009:
 
<!-- Vendor Scripts -->
 
<!-- Vendor Scripts -->
 
<script src="https://2018.igem.org/Team:HUST-China/js/modernizr-custom?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2018.igem.org/Team:HUST-China/js/modernizr-custom?action=raw&amp;ctype=text/javascript"></script>
−
<script src="https://2018.igem.org/Team:HUST-China/js/Vendor-jquery-zoomslider?action=raw&amp;ctype=text/javascript"></script>
+
<!--
−
<script src="https://2018.igem.org/Team:HUST-China/js/Vendor-jquery-isotope?action=raw&amp;ctype=text/javascript"></script>
+
<script src="js/modernizr.custom.js"></script>
−
<script src="https://2018.igem.org/Team:HUST-China/js/Vendor-jquery-magnific-popup?action=raw&amp;ctype=text/javascript"></script>
+
-->
−
<script src="https://2018.igem.org/Team:HUST-China/js/Vendor-animate?action=raw&amp;ctype=text/javascript"></script>  
+
<script src="js/jquery.zoomslider.min.js"></script>
−
<script src="https://2018.igem.org/Team:HUST-China/js/Vendor-custom?action=raw&amp;ctype=text/javascript"></script>
+
<script src="js/jquery.isotope.min.js"></script>
 +
<script src="js/jquery.magnific-popup.min.js"></script>
 +
<script src="js/animate.js"></script>  
 +
<script src="js/custom.js"></script>
 
<script type="text/javascript">
 
<script type="text/javascript">
 
    
 
    

Revision as of 08:02, 14 October 2018

HillSide Multi purpose HTML5 Template

account_balance

Human Practices

A communication with our professors

In the initial project design, we hope to co-culture cyanobacteria and Shewanella to build a bio-power producing system. Cyanobacteria could utilize solar energy to produce lactate, which can be the carbon source of Shewanella. Then, Shewanella could produce electricity. However, during the discussion, Professor Yunjun Yan pointed out a serious problem. Cyanobacteria would inevitably produce oxygen during photosynthesis, and Shewanella's electrogenesis relies on an anaerobic environment. This contradiction will make the system we build unstable and cannot work efficiently and continuously. We started to search for another kind of photosynthetic bacteria. After some effort, we finally chose Rhodopseudomonas palustris. This kind of bacteria can not only carry out photosynthesis without restricting the growth of Shewanella, but use sodium acetate as a energy source for growth. Sodium acetate is a metabolite of Shewanella after using lactate. Based on all these facts, Rhodopseudomonas palustris is a really great “teammate” to work with shewanella. After we set up the project, we try to make the project more related to social production and life. We decided to cater to China's energy transformation strategy and provide a new idea for utilization of solar energy. We communicate the experts of this field to know more about the concerns and requirements from the society, thus guiding our project to work in a more efficient way.

Investiation on Electric Company

We took a visit to Shenglong Electric and Hiconics Drived Technology Co. These two companies mainly focus on producing electrical energy and designing more efficient solar panels. Workers over there gave us some information about the current status and future development direction of electrical industries. They also put forward some valuable opinions on our projects in many directions, such as portability, environmental protection and marketability.

A Visit to Shenglong Electric

Shenglong Electric is one of the leading manufacturer of power transmission and distribution equipment in China. Shenglong Electric's business covers all provinces and cities in China and more than 20 countries overseas. We visited the company on August 9, 2018 and made an interview to their technical director. He mentioned that the biggest limitation to the construction of photovoltaic power plants is natural conditions. There is no suitable large-scale land to build solar power stations in the eastern regions in China. However, the electricity consumption in this area is really high. It will be a good idea that we use bacteria, a system at a really small scale to produce enough electric energy to solve the land limitation problem. In addition, when exposed to light, Rhodopseudomonas pallidum absorbs light energy and stores it in the negative electrode chamber in form of lactate. When the light is off, even if the lactate in the negative electrode chamber is consumed, its content does not change abruptly. That means the microbial fuel cell also has a certain energy storage function, which can continuously supply power, so the problem that solar power generation cannot be continuously powered on cloudy days and nights can be solved.

A Visit to Hiconics Drived Technology Co. (Wuhan)

On August 15, 2018, we visited Hiconics Drived Technology Co. (Wuhan). This company’s products mainly focus on equipment manufacturing and high-tech industries with high-end manufacturing of energy-saving equipment, new energy vehicles and environmental protection. Representatives from the company took us visit the new energy vehicles, solar charging sheds, charging piles and charging stations they designed. They told us many things about the development of solar energy in our country, the national policy of new energy generation and the main problems exists at present, such as the recycling and reuse of solar panels made of monocrystalline and polycrystalline silicon and the impact of secondary pollution. We still need to pay more attention to the by-product of our “Optopia” to avoid the pollution. Because we are still working at a small scale, the pollution cannot be detected. We are going to do experiments at a larger scale to see its impact on the environment if possible.

Communicate with the professors

An Interview to Professor Zhiguang Zhu from Tianjin Industrial Biology Institute

We are really lucky to get the opportunity to interview Professor Zhiguang Zhu, a professor who studies biomass fuel cells based on multi-enzyme catalysis. We gave Prof. Zhu a detailed introduction to the synthetic biology knowledge related to our project and asked about the feasibility of our project ideas. Prof. Zhu highly recognized our project and further discussed with the team members about the possible content of bio-batteries. After that, Professor Zhu and our team members discussed about the current international market of bio-power generation and the problems to be solved in bio-electricity industrialization, which inspired our team members about the practical application of bio-generation. He also gave some suggestions to our project. For example, we are now simply mixing the 2 kinds of bacteria together, but this may lead to a greater internal electronic resistance. Moreover, as Rhodopseudomonas palustris can transfer solar energy into lactate, we can use this part to do something else such as medical production. This interview not only gave us a further understanding of our projects, but also broadened our horizons and gave us an insight into the global status of bio-generators.

An Interview with Professor Zhou Yinhua of Wuhan National Research Center for Optoelectronics

Professor Zhou Yinhua from the National Research Center for Optoelectronics of Huazhong University of Science and Technology is mainly involved in the research of organic/polymer semiconductor energy devices. During the conversation with Professor Zhou, he gave a professional explanation to make us a understanding solar energy even further. After that, Professor Zhou explained to us in detail the advantages of solar energy projects. Our team members exchanged our ideas with Professor Zhou on the current situation of solar energy and market prospect. This conversation taught us a lot of biological knowledge that we did not learn in the past, and also pointed out new directions for our future science and technology. He pointed out several problems existed nowadays in solar energy projects, such as the obstacles between the application of solar energy projects and real life, the commercialization of solar energy, the cost and so on. Therefore, we will take these issues into consideration and try to solve them through our project.

College of Life Science & Technology
Huazhong University of Science and Technology
Add: 1037 Luoyu Road, Wuhan, Hubei, China; P.C: 430074
Copyright ©2018 Huazhong University of Science & Technology. Produced By HUST-China