Difference between revisions of "Team:SUSTech Shenzhen"

Line 1: Line 1:
 
{{:Team:SUSTech_Shenzhen/removeStyles}}
 
{{:Team:SUSTech_Shenzhen/removeStyles}}
 
{{:Team:SUSTech_Shenzhen/themeCss}}
 
{{:Team:SUSTech_Shenzhen/themeCss}}
 +
{{:Team:SUSTech Shenzhen/css/homepage-css}}
  
<html><link rel="stylesheet" href="https://2017.igem.org/Team:SUSTech_Shenzhen/css/homepage-css" />
 
<meta name="google-site-verification" content="dqozyfW9t0H3bW-E5mvbG2nRJPpYki_a4Mi_xeYydHk" /></html>
 
 
{{:Team:SUSTech_Shenzhen/nav|
 
{{:Team:SUSTech_Shenzhen/nav|
 
opacity=1}}
 
opacity=1}}

Revision as of 05:27, 18 October 2017

Team SUSTC-Shenzhen

  1. soundGIF {
   max-height: 40vh;

}

body {

   font-family: 'Questrial','Helvetica Neue',Arial,sans-serif;
   background-color: #282828;
   color: #d3d3d3;
   webkit-tap-highlight-color: #222

}

hr {

   max-width: 80px;
   border-width: 3px;
   opacity: .09;
   margin-top: 15px;
   margin-bottom: 15px

}

hr.light {

   border-color: #fff

}

.wide-space {

   letter-spacing: 1.6px

}

.icon-lg {

   font-size: 50px;
   line-height: 18px

}

.bg-primary {

   background-color: #333

}

.bg-dark {

   color: #eee;
   background-color: #222

}

.cursive {

   font-family: 'Lato',cursive;
   text-transform: none

}

.text-faded {

   color: rgba(245,245,245,0.7)

}

.text-dark {

   color: #111

}

.text-primary {

   color: #9c27b0

}

.no-padding {

   padding: 0

}

header {

   position: relative;
   min-height: auto;
   text-align: center;
   color: #fff;
   width: 100%;
   background-color: #000000;
   background-position: center;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   background-size: cover;
   -o-background-size: cover

}

header .header-content {

   position: relative;
   width: 100%;
   padding: 100px 15px;
   text-align: center;
   z-index: 2

}

header .header-content .inner h1 {

   margin-top: 0;
   margin-bottom: 0

}

header .header-content .inner p {

   margin-bottom: 50px;
   font-size: 16px;
   font-weight: 300;
   color: rgba(255,255,255,0.7)

}

  1. video-background {
   position: absolute;
   left: 0;
   bottom: 0;
   min-width: 100%;
   min-height: 100%;
   width: auto;
   height: auto;
   z-index: 1

}

  1. video-background.collapsing {
   display: none

}

footer {

   background-color: #2d2d2d

}

section {

 padding: 70px 0;

}

.gallery-box {

 display: block;
 position: relative;
 margin: 0 auto;
 max-width: 650px;
 overflow: hidden;
 height: 350px;

}

.gallery-box .gallery-box-caption {

 display: block;
 position: absolute;
 bottom: 0;
 width: 100%;
 height: 100%;
 text-align: center;
 color: #fff;
 opacity: 0;
 background: rgba(44, 44, 44, .8);
 -webkit-transition: all .35s;
 -moz-transition: all .35s;
 transition: all .35s;

}

.gallery-box .gallery-box-caption .gallery-box-content {

 position: absolute;
 top: 50%;
 width: 100%;
 text-align: center;
 transform: translateY(-50%);

}

.gallery-box:hover .gallery-box-caption {

 opacity: 1;

}

.gallery-box:hover img {

 -webkit-transform: scale(1.1);
 -ms-transform: scale(1.1);
 transform: scale(1.1);

}

.gallery-box img {

 -webkit-transition: all 300ms ease-in-out;
 transition: all 300ms ease-in-out;
 height: 100%;
 min-width: 100%;

}

.gallery-box:hover .gallery-box-image {

 -webkit-transform: scale(1.1);
 -ms-transform: scale(1.1);
 transform: scale(1.1);

}

.no-padding {

 padding: 0;

}

.no-gutter > [class*=col-] {

 padding-right: 0;
 padding-left: 0;

}

.gallery-box .gallery-box-image {

 -webkit-transition: all 300ms ease-in-out;
 transition: all 300ms ease-in-out;
 height: 100%;
 width: 100%;
 -o-background-size: cover;
 -moz-background-size: cover;
 -webkit-background-size: cover;
 background-size: cover;

}

.btn-default {

 border-color: #fff;
 color: #222;
 background-color: #fff;
 -webkit-transition: all .35s;
 -moz-transition: all .35s;
 transition: all .35s;

}

.btn-default:hover, .btn-default:focus, .btn-default.focus, .btn-default:active, .btn-default.active {

 border-color: #ededed;
 color: #222;
 background-color: #f2f2f2;
 opacity: 0.7;

}

.btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default {

 background-image: none;

}

.btn-default.disabled, .btn-default[disabled], fieldset[disabled] .btn-default, .btn-default.disabled:hover, .btn-default[disabled]:hover, fieldset[disabled] .btn-default:hover, .btn-default.disabled:focus, .btn-default[disabled]:focus, fieldset[disabled] .btn-default:focus, .btn-default.disabled.focus, .btn-default[disabled].focus, fieldset[disabled] .btn-default.focus, .btn-default.disabled:active, .btn-default[disabled]:active, fieldset[disabled] .btn-default:active, .btn-default.disabled.active, .btn-default[disabled].active, fieldset[disabled] .btn-default.active {

 border-color: #fff;
 background-color: #fff;
 opacity: 0.7;

}

.btn-default .badge {

 color: #fff;
 background-color: #222;

}

.btn.btn-primary {

 background-color: transparent;
 border: 1px solid #f0f0f0;
 border-color: #f0f0f0;
 -webkit-transition: all .35s;
 -moz-transition: all .35s;
 transition: all .35s;

}

.btn.btn-primary:hover {

 opacity: 0.7;

}

.btn {

 border: 0;
 border-radius: 290px;
 font-family: 'Lato', 'Raleway', sans-serif;
 font-weight: 100;

}

.btn-xl {

 padding: 15px 30px;
 font-size: 20px;

}

@media(min-width: 768px) {

   .icon-lg {
       font-size:80px
   }
   header {
       min-height: 100vh
   }
   header .header-content {
       position: absolute;
       top: 400px;
       padding: 0 50px;
       -webkit-transform: translateY(-50%);
       -ms-transform: translateY(-50%);
       transform: translateY(-50%)
   }
   header .header-content .inner {
       margin-right: auto;
       margin-left: auto;
       max-width: 1400px
   }
   header .header-content .inner h1 {
       font-size: 53px
   }
   header .header-content .inner p {
       margin-right: auto;
       margin-left: auto;
       max-width: 80%;
       font-size: 18px
   }
   section {
       min-height: 600px;
       padding: 100px 0
   }

}

Made by from the elegans.Inc in SUSTech_Shenzhen.

Licensed under CC BY 4.0.