|
|
(41 intermediate revisions by 3 users not shown) |
Line 1: |
Line 1: |
| + | {{SDSZ-China}} |
| <html> | | <html> |
− | <style type="text/css">
| |
− | .container{
| |
− | padding:0px !important;
| |
− | }
| |
| | | |
− | @import url(http://fonts.googleapis.com/css?family=Lato:400,700);
| + | <head> |
− | @import url("/wiki/skins/igem/top_menu_14.css");
| + | <title>Project</title> |
| | | |
− | #content {
| |
− | margin: 0;
| |
− | margin-top:-10px;
| |
− | padding: 0;
| |
− | width: auto;
| |
− | border: 0;
| |
− | outline: 0;
| |
− | font-size: 100%;
| |
− | vertical-align: baseline;
| |
− | background: transparent;
| |
− | position: static;
| |
− | }
| |
− | p{
| |
− |
| |
− | }
| |
− |
| |
− | h1,
| |
− | h2,
| |
− | h3,
| |
− | h4,
| |
− | h5,
| |
− | h6 {
| |
− | margin: 0;
| |
− | padding: 0;
| |
− | border: 0;
| |
− | outline: 0;
| |
− | background: transparent;
| |
− | }
| |
− | .printfooter,
| |
− | #menubar,
| |
− | #siteSub,
| |
− | #contentSub,
| |
− | #search-controls,
| |
− | .firstHeading,
| |
− | #footer-box,
| |
− | #catlinks,
| |
− | #p-logo {
| |
− | display: none;
| |
− | }
| |
− | body,#bodyContent {
| |
− | margin: 0px 0 0 0;
| |
− | padding: 0;
| |
− | top:0px;
| |
− | }
| |
− | #top-section {
| |
− | width: 965px;
| |
− | height: 0;
| |
− | margin: 0 auto;
| |
− | padding: 0;
| |
− | border: none;
| |
− | }
| |
− | #menubar {
| |
− | font-size: 65%;
| |
− | top: -14px;
| |
− | }
| |
− | .left-menu:hover {
| |
− | background-color: transparent;
| |
− | }
| |
− | #menubar li a {
| |
− | background-color: transparent;
| |
− | }
| |
− | #menubar:hover {
| |
− | color: white;
| |
− | }
| |
− | #menubar li a {
| |
− | color: transparent;
| |
− | }
| |
− | #menubar:hover li a {
| |
− | color: white;
| |
− | }
| |
− | body,#bodyContent
| |
− | html {
| |
− | height: 100%;
| |
− | }
| |
− | body,#bodyContent {
| |
− | background-attachment: fixed;
| |
− | background-repeat: repeat;
| |
− | }
| |
− | html {
| |
− | overflow-y: scroll;
| |
− | }
| |
− | header > .container {
| |
− | padding-top: 25px;
| |
− | padding-bottom: 15px;
| |
− | }
| |
− | .container {
| |
− | max-width: 1250px;
| |
− | }
| |
− | .absolute_center {
| |
− | margin: auto;
| |
− | position: absolute;
| |
− | top: 0;
| |
− | left: 0;
| |
− | bottom: 0;
| |
− | right: 0;
| |
− | }
| |
− | .sketch {
| |
− | display: none;
| |
− | opacity: 1;
| |
− | position: fixed;
| |
− | top: 0;
| |
− | }
| |
− | #masthead #big-video-wrap {
| |
− | position: static;
| |
− | }
| |
− | #masthead #head_text {
| |
− | margin: auto;
| |
− | position: absolute;
| |
− | top: 0;
| |
− | left: 0;
| |
− | bottom: 0;
| |
− | right: 0;
| |
− | height: 100px;
| |
− | }
| |
− | #masthead h1,
| |
− | #masthead h2 {
| |
− | font-family: Lato;
| |
− | color: white;
| |
− | opacity: 0.99;
| |
− | text-align: center;
| |
− | margin: 0;
| |
− | }
| |
− | #masthead h1 {
| |
− | letter-spacing: 6px;
| |
− | margin-bottom: 5px;
| |
− | font-size: 60px;
| |
− | }
| |
− | #masthead h2 {
| |
− | font-size: 15px;
| |
− | }
| |
− | .nav #nav_left {
| |
− | display: inline-block;
| |
− | vertical-align: bottom;
| |
− | }
| |
− | .nav #nav_left img {
| |
− | width: 170px;
| |
− | }
| |
− | .nav #nav_right {
| |
− | margin-left: 15px;
| |
− | display: inline-block;
| |
− | vertical-align: bottom;
| |
− | }
| |
− | .nav #nav_right h2 {
| |
− | color: white;
| |
− | font-size: 70px;
| |
− | margin-top: 0;
| |
− | margin-bottom: 0;
| |
− | }
| |
− | .nav ul {
| |
− | padding: 0;
| |
− | margin-top: 0;
| |
− | }
| |
− | .nav ul li {
| |
− | list-style-type: none;
| |
− | display: inline-block;
| |
− | color: white;
| |
− | border-right: 1px solid white;
| |
− | padding: 0 10px;
| |
− | margin-left: 0px;
| |
− | }
| |
− | .nav ul li:last-child {
| |
− | border: 0;
| |
− | }
| |
− | .quotespacer {
| |
− | border-top: 1px solid white;
| |
− | width: 150px;
| |
− | height: 1px;
| |
− | display: block;
| |
− | margin: 0 auto;
| |
− | }
| |
− | #missionquote {
| |
− | -webkit-animation: 20s huerotate linear infinite;
| |
− | margin: 15px auto;
| |
− | }
| |
− | #telomere {
| |
− | width: 100%;
| |
− | height: 360px;
| |
− | background-size: 100%;
| |
− | background-repeat: no-repeat;
| |
− | transition: 1s ease;
| |
− | }
| |
− | #telomere:hover {
| |
− | -webkit-transform: scale(1.1);
| |
− | }
| |
− | #portrait_container {
| |
− | border-right: 1px solid white;
| |
− | }
| |
− | #portrait_container img {
| |
− | width: 15%;
| |
− | padding: 5px;
| |
− | transition: 0.2s ease;
| |
− | }
| |
− | #portrait_container img:hover {
| |
− | cursor: pointer;
| |
− | -webkit-transform: scale(1.3);
| |
− | }
| |
− | #portrait_container > .row {
| |
− | padding-top: 5px;
| |
− | }
| |
− | #portrait_container > .row:last-child {
| |
− | padding-bottom: 5px;
| |
− | }
| |
− | @-webkit-keyframes huerotate {
| |
− | 0% {
| |
− | -webkit-filter: hue-rotate(0deg);
| |
− | }
| |
− | 100% {
| |
− | -webkit-filter: hue-rotate(360deg);
| |
− | }
| |
− | }
| |
− | .SVG_igem_logo .PATH_tiger_logo {
| |
− | fill: none;
| |
− | stroke: #fdd700;
| |
− | stroke-width: 2.5;
| |
− | stroke-linecap: round;
| |
− | stroke-linejoin: miter;
| |
− | stroke-miterlimit: 4;
| |
− | stroke-opacity: 1;
| |
− | stroke-dashoffset: 0;
| |
− | }
| |
− | .SVG_igem_logo .PATH_igem_logo_text {
| |
− | fill: none;
| |
− | stroke: #252f62;
| |
− | stroke-width: 2.5;
| |
− | stroke-linecap: round;
| |
− | stroke-linejoin: miter;
| |
− | stroke-miterlimit: 4;
| |
− | stroke-opacity: 1;
| |
− | stroke-dashoffset: 0;
| |
− | }
| |
− | .SVG_igem_logo .PATH_igem_logo_darkgreen {
| |
− | fill: none;
| |
− | stroke: #096836;
| |
− | stroke-width: 2.5;
| |
− | stroke-linecap: round;
| |
− | stroke-linejoin: miter;
| |
− | stroke-miterlimit: 4;
| |
− | stroke-opacity: 1;
| |
− | stroke-dashoffset: 0;
| |
− | }
| |
− | .SVG_igem_logo .PATH_igem_logo_lightgreen {
| |
− | fill: none;
| |
− | stroke: #99cc99;
| |
− | stroke-width: 2.5;
| |
− | stroke-linecap: round;
| |
− | stroke-linejoin: miter;
| |
− | stroke-miterlimit: 4;
| |
− | stroke-opacity: 1;
| |
− | stroke-dashoffset: 0;
| |
− | }
| |
− | /******************* SLDIESJS ******************/
| |
− | #slides {
| |
− | display: none;
| |
− | }
| |
− | #slides .slidesjs-navigation {
| |
− | margin-top: 3px;
| |
− | }
| |
− | #slides .slidesjs-previous {
| |
− | margin-right: 5px;
| |
− | float: left;
| |
− | }
| |
− | #slides .slidesjs-next {
| |
− | margin-right: 5px;
| |
− | float: left;
| |
− | }
| |
− | .slidesjs-pagination {
| |
− | margin: 6px 0 0;
| |
− | float: right;
| |
− | list-style: none;
| |
− | }
| |
− | .slidesjs-pagination li {
| |
− | float: left;
| |
− | margin: 0 1px;
| |
− | }
| |
− | .slidesjs-pagination li a {
| |
− | display: block;
| |
− | width: 13px;
| |
− | height: 0;
| |
− | padding-top: 13px;
| |
− | background-position: 0 0;
| |
− | float: left;
| |
− | overflow: hidden;
| |
− | }
| |
− | .slidesjs-pagination li a.active,
| |
− | .slidesjs-pagination li a:hover.active {
| |
− | background-position: 0 -13px;
| |
− | }
| |
− | .slidesjs-pagination li a:hover {
| |
− | background-position: 0 -26px;
| |
− | }
| |
− | #slides a:link,
| |
− | #slides a:visited {
| |
− | color: #333;
| |
− | }
| |
− | #slides a:hover,
| |
− | #slides a:active {
| |
− | color: #9e2020;
| |
− | }
| |
− | .navbar {
| |
− | overflow: hidden;
| |
− | }
| |
− | .slideContainer {
| |
− | margin: 0 auto;
| |
− | }
| |
− | #projIntroContainer {
| |
− | padding: 0px 0px 0px 0px;
| |
− | text-align: center;
| |
− | }
| |
− | #projIntro {
| |
− | margin-top: -8px;
| |
− | padding-top: 0px;
| |
− | text-align: justify;
| |
− | padding-right: 40px;
| |
− | font-size: 19px;
| |
− | font-family: 'Poiret One', cursive;
| |
− | }
| |
− | /*************** BIGVIDEO.JS **************/
| |
− | #big-video-wrap {
| |
− | overflow: hidden;
| |
− | height: 100%;
| |
− | width: 100%;
| |
− | top: 0;
| |
− | left: 0;
| |
− | }
| |
− | #big-video-vid,
| |
− | #big-video-image {
| |
− | position: absolute;
| |
− | }
| |
− | #big-video-control-container {
| |
− | position: fixed;
| |
− | bottom: 0;
| |
− | padding: 10px;
| |
− | width: 100%;
| |
− | background: rgba(0, 0, 0, 0.25);
| |
− | -webkit-transition-duration: 0.6s;
| |
− | -moz-transition-duration: 0.6s;
| |
− | -ms-transition-duration: 0.6s;
| |
− | -o-transition-duration: 0.6s;
| |
− | transition-duration: 0.6s;
| |
− | }
| |
− | #big-video-control {
| |
− | width: 100%;
| |
− | height: 16px;
| |
− | position: relative;
| |
− | }
| |
− | #big-video-control-middle {
| |
− | margin: 0 56px 0 24px;
| |
− | }
| |
− | #big-video-control-bar {
| |
− | width: 100%;
| |
− | height: 16px;
| |
− | position: relative;
| |
− | cursor: pointer;
| |
− | }
| |
− | #big-video-control-progress {
| |
− | position: absolute;
| |
− | top: 7px;
| |
− | height: 3px;
| |
− | width: 0%;
| |
− | background: #fff;
| |
− | }
| |
− | #big-video-control-track {
| |
− | position: absolute;
| |
− | top: 8px;
| |
− | height: 1px;
| |
− | width: 100%;
| |
− | background: #fff;
| |
− | }
| |
− | #big-video-control-bound-left {
| |
− | left: 0;
| |
− | }
| |
− | #big-video-control-bound-right {
| |
− | right: -1px;
| |
− | }
| |
− | #big-video-control-track .ui-slider-handle {
| |
− | opacity: 0;
| |
− | }
| |
− | #big-video-control-playhead {
| |
− | left: 30%;
| |
− | }
| |
− | #big-video-control-play {
| |
− | position: absolute;
| |
− | top: 0;
| |
− | left: 0;
| |
− | height: 16px;
| |
− | width: 16px;
| |
− | }
| |
− | #big-video-control-timer {
| |
− | position: absolute;
| |
− | top: 1px;
| |
− | right: 0;
| |
− | color: #fff;
| |
− | font-size: 11px;
| |
− | }
| |
− | #big-video-control-playhead,
| |
− | #big-video-control-bound-left,
| |
− | #big-video-control-bound-right {
| |
− | position: absolute;
| |
− | top: 0;
| |
− | height: 16px;
| |
− | width: 1px;
| |
− | background: #fff;
| |
− | }
| |
− | #big-video-control .ui-slider-handle {
| |
− | border-left: solid 1px #fff;
| |
− | width: 16px;
| |
− | height: 16px;
| |
− | position: absolute;
| |
− | top: -8px;
| |
− | }
| |
− | .transparent {
| |
− | -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
| |
− | filter: alpha(opacity=0);
| |
− | -moz-opacity: 0;
| |
− | -khtml-opacity: 0;
| |
− | opacity: 0;
| |
− | }
| |
− | .vjs-big-play-button {
| |
− | display: none !important;
| |
− | }
| |
− | canvas {
| |
− | position: fixed;
| |
− | top: 0px;
| |
− | left: 0px;
| |
− | }
| |
− | .card {
| |
− | margin-left: auto;
| |
− | margin-right: auto;
| |
− | background-color: white;
| |
− | box-shadow: 0px 0px 5px black;
| |
− | padding: 50px;
| |
− | }
| |
− | .card_pic {
| |
− | margin-left: auto;
| |
− | margin-right: auto;
| |
− | background-color: white;
| |
− | box-shadow: 0px 0px 5px black;
| |
− | padding: 0px;
| |
− | }
| |
− | .container {
| |
− | padding: 0px;
| |
− | min-width: 1250px;
| |
− | }
| |
− | .container div nav {
| |
− | min-width: 1250px;
| |
− | }
| |
− | button:focus {
| |
− | outline: 0 !important;
| |
− | }
| |
− | a:focus {
| |
− | outline: 0 !important;
| |
− | }
| |
− | img {
| |
− | max-width: 100%;
| |
− | }
| |
− | a {
| |
− | text-decoration: none;
| |
− | color: inherit !important;
| |
− | }
| |
− | a:hover {
| |
− | color: inherit;
| |
− | }
| |
− | .full {
| |
− | padding: 0;
| |
− | }
| |
− | .slidesjs-pagination {
| |
− | margin-top: -25px;
| |
− | margin-right: 10px;
| |
− | z-index: 10;
| |
− | position: relative;
| |
− | }
| |
− | #slides .heroImageContainer {
| |
− | background-size: cover;
| |
− | padding-top: 54%;
| |
− | background-position: 50% 50%;
| |
− | background-repeat: no-repeat;
| |
− | }
| |
− | #slides .heroImageContainer h3 {
| |
− | opacity: 0.85;
| |
− | max-width: 400px;
| |
− | position: absolute;
| |
− | padding: 10px 20px;
| |
− | font-weight: normal;
| |
− | color: black;
| |
− | font-size: 35px;
| |
− | font-family: Lato;
| |
− | }
| |
− | #slides .heroImageContainer h3 span {
| |
− | font-size: 21px;
| |
− | display: block;
| |
− | }
| |
− | #slides .heroImageContainer h3.topleft {
| |
− | top: 0;
| |
− | left: 0;
| |
− | margin-left: 20px;
| |
− | }
| |
− | #slides .heroImageContainer h3.topright {
| |
− | top: 0;
| |
− | right: 5px;
| |
− | margin-right: 20px;
| |
− | }
| |
− | #slides .heroImageContainer h3.bottomleft {
| |
− | bottom: 0;
| |
− | left: 0;
| |
− | margin-bottom: 35px;
| |
− | margin-left: 20px;
| |
− | }
| |
− | #slides .heroImageContainer h3.bottomright {
| |
− | bottom: 0;
| |
− | right: 5px;
| |
− | margin-bottom: 35px;
| |
− | margin-right: 20px;
| |
− | }
| |
− | #slides .heroImageContainer h3.red {
| |
− | background-color: #d10000;
| |
− | }
| |
− | #slides .heroImageContainer h3.purple {
| |
− | background-color: #8e44ad;
| |
− | }
| |
− | #slides .heroImageContainer h3.blue {
| |
− | background-color: #2c3e50;
| |
− | }
| |
− | #slides .heroImageContainer h3.belize {
| |
− | background-color: #2980b9;
| |
− | }
| |
− | #slides .heroImageContainer h3.green {
| |
− | background-color: #27ae60;
| |
− | }
| |
− | #slides .heroImageContainer h3.orange {
| |
− | background-color: #f39c12;
| |
− | }
| |
− | #slides .heroImageContainer h3.hide {
| |
− | display: none;
| |
− | }
| |
− | #slides .heroImageContainer .slidesjs-control,
| |
− | #slides .heroImageContainer .slidesjs-container {
| |
− | width: 100% !important;
| |
− | }
| |
− | nav ul {
| |
− | margin: 0;
| |
− | padding: 0;
| |
− | }
| |
− | nav .dropdown-menu {
| |
− | border: 0px;
| |
− | margin-top: 0px;
| |
− | padding: 10px;
| |
− | box-shadow: 0px 0px 5px black;
| |
− | z-index: -1;
| |
− | }
| |
− | nav .dropdown-menu img {
| |
− | width: 90px;
| |
− | opacity: 0.85;
| |
− | float: left;
| |
− | margin-right: 5px;
| |
− | }
| |
− | nav .dropdown-menu h4 {
| |
− | color: white;
| |
− | padding: 5px;
| |
− | margin: 0;
| |
− | font-family: Lato;
| |
− | font-size: 20px;
| |
− | }
| |
− | nav .dropdown-menu .subcategories_container {
| |
− | display: inline-block;
| |
− | width: 100%;
| |
− | cursor: pointer;
| |
− |
| |
− | }
| |
− | nav .dropdown-menu .subcategories_container > div {
| |
− | min-width: 250px;
| |
− | display: inline-block;
| |
− | text-align: center;
| |
− | border: 1px solid white;
| |
− | padding-left:15px;
| |
− | padding-right:15px;
| |
− | }
| |
− | nav .dropdown-menu .subcategories_container h5 {
| |
− | font-family: Lato;
| |
− | text-transform: uppercase;
| |
− | font-size: 16px;
| |
− | color: white;
| |
− | }
| |
− | nav li.dropdown {
| |
− | width: 205px;
| |
− | display: inline-block;
| |
− | margin-right: 0px;
| |
− | height: 40px;
| |
− | margin-bottom: 0px;
| |
− | }
| |
− | nav li.dropdown > a {
| |
− | height:35px;
| |
− | text-decoration: none;
| |
− | display: block;
| |
− | text-align: center;
| |
− | margin: 10px;
| |
− | }
| |
− | nav li.dropdown a > h4 {
| |
− | color: white;
| |
− | font-weight: normal;
| |
− | font-size: 16px;
| |
− | padding: 0;
| |
− | margin: 0;
| |
− | text-align: center;
| |
− | }
| |
− | nav li.dropdown {
| |
− | color: white;
| |
− | }
| |
− | nav li.dropdown:nth-child(1) {
| |
− | background-color: #1C77C3;
| |
− | }
| |
− | nav li.dropdown:nth-child(1) > .dropdown-menu {
| |
− | background-color: #1C77C3;
| |
− | background-size: 400px;
| |
− | width: 1250px;
| |
− | }
| |
− | nav li.dropdown:nth-child(1) > .dropdown-menu .subcategories_container > div {
| |
− | background-color: rgba(33, 150, 243, 0.6);
| |
− | }
| |
− | nav li.dropdown:nth-child(2) {
| |
− | background-color: #1C77C3;
| |
− | }
| |
− | nav li.dropdown:nth-child(2) > .dropdown-menu {
| |
− | background-color: #1C77C3;
| |
− | background-size: 400px;
| |
− | width: 1250px;
| |
− | margin-left: -209px;
| |
− | }
| |
− | nav li.dropdown:nth-child(2) > .dropdown-menu .subcategories_container > div {
| |
− | background-color: rgba(33, 150, 243, 0.6);
| |
− | }
| |
− | nav li.dropdown:nth-child(3) {
| |
− | background-color: #1C77C3;
| |
− | }
| |
− | nav li.dropdown:nth-child(3) > .dropdown-menu {
| |
− | background-color: #1C77C3;
| |
− | background-size: 400px;
| |
− | width: 1250px;
| |
− | margin-left: -418px;
| |
− | }
| |
− | nav li.dropdown:nth-child(3) > .dropdown-menu .subcategories_container > div {
| |
− | background-color: rgba(33, 150, 243, 0.6);
| |
− | }
| |
− | nav li.dropdown:nth-child(4) {
| |
− | background-color: #1C77C3;
| |
− | }
| |
− | nav li.dropdown:nth-child(4) > .dropdown-menu {
| |
− | background-color: #1C77C3;
| |
− | background-size: 400px;
| |
− | margin-left: -627px;
| |
− | width: 1250px;
| |
− | }
| |
− | nav li.dropdown:nth-child(4) > .dropdown-menu .subcategories_container > div {
| |
− | background-color: rgba(33, 150, 243, 0.6);
| |
− | }
| |
− | nav li.dropdown:nth-child(5) {
| |
− | background-color: #1C77C3;
| |
− | }
| |
− | nav li.dropdown:nth-child(5) > .dropdown-menu {
| |
− | background-color: #1C77C3;
| |
− | background-size: 300px;
| |
− | margin-left: -836px;
| |
− | width: 1250px;
| |
− | }
| |
− | nav li.dropdown:nth-child(5) > .dropdown-menu .subcategories_container > div {
| |
− | background-color: rgba(33, 150, 243, 0.6);
| |
− | }
| |
− | nav li.dropdown:nth-child(6) {
| |
− | background-color: #1C77C3;
| |
− | }
| |
− | nav li.dropdown:nth-child(6) > .dropdown-menu {
| |
− | background-color: #1C77C3;
| |
− | background-size: 300px;
| |
− | width: 1250px;
| |
− | margin-left: -1045px;
| |
− | }
| |
− | nav li.dropdown:nth-child(6) > .dropdown-menu .subcategories_container > div {
| |
− | background-color: rgba(33, 150, 243, 0.6);
| |
− | }
| |
− | footer {
| |
− | height: 20px;
| |
− | background-color: #2c3e50;
| |
− | }
| |
− | footer .cornered {
| |
− | float: left;
| |
− | width: 300px;
| |
− | height: 0px;
| |
− | border-top: 20px solid #bdc3c7;
| |
− | border-right: 45px solid transparent;
| |
− | }
| |
− | footer .footer_right {
| |
− | color: white;
| |
− | padding: 25px;
| |
− | float: right;
| |
− | height: 100%;
| |
− | }
| |
− | footer .footer_right span {
| |
− | opacity: 0.5;
| |
− | }
| |
− | #bodycontainer {
| |
− | min-width: 1200px;
| |
− | margin: auto;
| |
− | padding: 10px 0;
| |
− | text-align:left;
| |
− | }
| |
− | #bodycontainer .overview_header {
| |
− | text-align: center;
| |
− | }
| |
− | #bodycontainer h3,
| |
− | #bodycontainer h4,
| |
− | #bodycontainer h5 {
| |
− | font-family: Lato;
| |
− | text-transform: uppercase;
| |
− | margin: 0px 0px 0px 0px;
| |
− | padding-top: 30px;
| |
− | }
| |
− | #bodycontainer h1,
| |
− | #bodycontainer h2{
| |
− | font-family: Lato;
| |
− | text-transform: uppercase;
| |
− | margin: 0px 0px 0px 0px;
| |
− | padding-top: 80px;
| |
− | }
| |
− | #bodycontainer .buttonrow {
| |
− | margin-bottom: 20px;
| |
− | }
| |
− | #bodycontainer .igem_button {
| |
− | position: relative;
| |
− | overflow: hidden;
| |
− | }
| |
− | #bodycontainer .igem_button img {
| |
− | transition: 0.4s ease;
| |
− | -webkit-filter: grayscale(0%);
| |
− | }
| |
− | #bodycontainer .igem_button .button_description {
| |
− | transition: 0.5s ease;
| |
− | background: rgba(44, 62, 80, 0.75);
| |
− | position: absolute;
| |
− | top: 100%;
| |
− | left: 0;
| |
− | width: 100%;
| |
− | height: 100%;
| |
− | }
| |
− | #bodycontainer .igem_button h2 {
| |
− | margin: 0 auto;
| |
− | margin-top: -27px;
| |
− | color: #dddddd;
| |
− | font-size: 16px;
| |
− | text-align: center;
| |
− | width: 100%;
| |
− | padding: 5px 0px;
| |
− | background: rgba(0, 0, 0, 0.41);
| |
− | font-family: Lato;
| |
− | text-transform: uppercase;
| |
− | border-bottom: 1px solid rgba(255, 255, 255, 0.3);
| |
− | }
| |
− | #bodycontainer .igem_button p {
| |
− | color: #dddddd;
| |
− | padding: 5px;
| |
− | }
| |
− | #bodycontainer .igem_button:hover > .button_description {
| |
− | top: 27px;
| |
− | }
| |
− | #bodycontainer .igem_button:hover > img {
| |
− | -webkit-filter: grayscale(100%);
| |
− | }
| |
− | #bodycontainer .red h2 {
| |
− | background: #d10000;
| |
− | }
| |
− | #bodycontainer .purple h2 {
| |
− | background: #8e44ad;
| |
− | }
| |
− | #bodycontainer .blue h2 {
| |
− | background: #2c3e50;
| |
− | }
| |
− | #bodycontainer .belize h2 {
| |
− | background: #2980b9;
| |
− | }
| |
− | #bodycontainer .green h2 {
| |
− | background: #27ae60;
| |
− | }
| |
− | #bodycontainer .orange h2 {
| |
− | background: #f39c12;
| |
− | }
| |
− | #category_navbar {
| |
− | color: black;
| |
− | padding-left: 0;
| |
− | padding: 5px;
| |
− | }
| |
− | #category_navbar .active {
| |
− | background: rgba(255, 156, 0, 0.17);
| |
− | border: 1px solid rgba(0, 0, 0, 0.17);
| |
− | }
| |
− | #category_navbar .nav > li > a {
| |
− | text-transform: uppercase;
| |
− | font-size: 16px;
| |
− | font-family: Lato;
| |
− | }
| |
− | #category_navbar .nav > ul > li,
| |
− | #category_navbar .nav > ul > ul > li {
| |
− | list-style-type: none;
| |
− | display: block;
| |
− | color: inherit;
| |
− | border: 0;
| |
− | margin-left: 10px;
| |
− | padding-top: 4px;
| |
− | padding-bottom: 4px;
| |
− | }
| |
− | #category_navbar .nav > ul > li a,
| |
− | #category_navbar .nav > ul > ul > li a {
| |
− | font-size: 14px;
| |
− | font-family: Lato;
| |
− | }
| |
− | #category_navbar .nav > ul > ul > li {
| |
− | margin-left: 35px;
| |
− | }
| |
− | #category_navbar .nav > ul > li:hover,
| |
− | #category_navbar .nav > ul > ul > li:hover {
| |
− | background: rgba(255, 255, 255, 0.5);
| |
− | }
| |
− | #member_spotlight h5 {
| |
− | padding: 5px 7px;
| |
− | color: white;
| |
− | }
| |
− | #member_spotlight .intro_large h5 {
| |
− | font-size: 20px;
| |
− | padding: 15px 15px;
| |
− | margin-bottom: 10px;
| |
− | }
| |
− | #member_spotlight #spotlight_question_1 h5 {
| |
− | background: #c0392b;
| |
− | width:auto;
| |
− | }
| |
− | #member_spotlight #spotlight_question_2 h5 {
| |
− | background: #8e44ad;
| |
− | width:auto;
| |
− | }
| |
− | #member_spotlight #spotlight_question_3 h5 {
| |
− | background: #2980b9;
| |
− | width:auto;
| |
− | }
| |
− | #member_spotlight #spotlight_question_intro h5 {
| |
− | background: #e67e22;
| |
− | width:auto;
| |
− | }
| |
− | #lab_notes {
| |
− | text-align: center;
| |
− | }
| |
− | #lab_notes img {
| |
− | margin: 0 auto;
| |
− | display: block;
| |
− | }
| |
− | #lab_notes :hover img {
| |
− | -webkit-transform: scale(1.1);
| |
− | }
| |
− | .block_header {
| |
− | display: inline-block;
| |
− | color: white;
| |
− | padding: 7px 11px;
| |
− | padding-bottom: 5px;
| |
− | }
| |
− | .affix {
| |
− | top: 80px;
| |
− | }
| |
− | .container {
| |
− | min-width: 1200px;
| |
− | }
| |
− | .container div nav {
| |
− | min-width: 1200px;
| |
− | }
| |
− | p,
| |
− | ol > li,
| |
− | td,
| |
− | th,
| |
− | caption,
| |
− | .ulstyled > li,
| |
− | .calendar > li {
| |
− | font-family: Lato;
| |
− | font-size: 15px;
| |
− | }
| |
− | p a,
| |
− | ol > li a,
| |
− | td a,
| |
− | th a,
| |
− | caption a,
| |
− | .ulstyled > li a,
| |
− | .calendar > li a {
| |
− | text-decoration: underline;
| |
− | color: #3b5998;
| |
− | }
| |
− | .calendar {
| |
− | padding-left: 10px;
| |
− | }
| |
− | .calendar > li {
| |
− | font-size: 13px;
| |
− | }
| |
− | figcaption {
| |
− | color: white;
| |
− | padding: 4px 5px;
| |
− | display: inline-block;
| |
− | font-size:14px;
| |
− | }
| |
− | figure {
| |
− | margin-bottom: 10px;
| |
− | }
| |
− | .red {
| |
− | background: #c0392b;
| |
− | }
| |
− | .purple {
| |
− | background: #8e44ad;
| |
− | }
| |
− | .blue {
| |
− | background: #2c3e50;
| |
− | }
| |
− | .belize {
| |
− | background: #2980b9;
| |
− | }
| |
− | .green {
| |
− | background: #27ae60;
| |
− | }
| |
− | .orange {
| |
− | background: #f39c12;
| |
− | }
| |
− | .darkblue {
| |
− | background: #34495e;
| |
− | }
| |
− | .table-bordered,
| |
− | .table-bordered > thead > tr > th,
| |
− | .table-bordered > tbody > tr > th,
| |
− | .table-bordered > tfoot > tr > th,
| |
− | .table-bordered > thead > tr > td,
| |
− | .table-bordered > tbody > tr > td,
| |
− | .table-bordered > tfoot > tr > td {
| |
− | border: 1px solid black;
| |
− | }
| |
− | .col-lg-offset-1half {
| |
− | margin-left: 11.111111111111%;
| |
− | }
| |
− | .clearfix:after {
| |
− | content: " ";
| |
− | display: block;
| |
− | height: 0;
| |
− | clear: both;
| |
− | }
| |
− |
| |
− |
| |
− |
| |
− |
| |
− | button.accordion {
| |
− | background-color: 9CFFFA;
| |
− | color: #444;
| |
− | cursor: pointer;
| |
− | padding: 18px;
| |
− | width: 100%;
| |
− | border: none;
| |
− | text-align: left;
| |
− | outline: none;
| |
− | font-size: 15px;
| |
− | transition: 0.4s;
| |
− | }
| |
− |
| |
− | button.accordion.active, button.accordion:hover {
| |
− | background-color: #AAFAC8;
| |
− | }
| |
− |
| |
− | button.accordion:after {
| |
− | content: '\02795';
| |
− | font-size: 13px;
| |
− | color: #777;
| |
− | float: right;
| |
− | margin-left: 5px;
| |
− | }
| |
− |
| |
− | button.accordion.active:after {
| |
− | content: "\2796";
| |
− | }
| |
− |
| |
− | div.panel {
| |
− | padding: 0 18px;
| |
− | background-color: #FFE8C8;
| |
− | max-height: 0;
| |
− | overflow: hidden;
| |
− | transition: 0.6s ease-in-out;
| |
− | opacity: 0;
| |
− | }
| |
− |
| |
− | div.panel.show {
| |
− | opacity: 1;
| |
− | min-height: 300px;
| |
− | max-height: 2000px;
| |
− | }
| |
− |
| |
− | div.container{
| |
− | width:100%
| |
− | }
| |
− |
| |
− | </style>
| |
− | </html>
| |
− |
| |
− | <!-- CUT -->
| |
− |
| |
− | <html>
| |
− |
| |
− | <head>
| |
| <style type='text/css'> | | <style type='text/css'> |
| #top_title, #sideMenu { | | #top_title, #sideMenu { |
Line 1,042: |
Line 36: |
| #bg { | | #bg { |
| position: fixed; | | position: fixed; |
− | z-index:-1; | + | z-index: -1; |
| top: 0; | | top: 0; |
| left: 0; | | left: 0; |
| } | | } |
| | | |
− | .bgwidth { | + | #bodycontainer { |
− | width: 100%; | + | background: rgba(255, 255, 255, 0.5); |
− | }
| + | |
− | | + | |
− | .bgheight {
| + | |
− | height: 100%;
| + | |
| } | | } |
| </style> | | </style> |
Line 1,061: |
Line 51: |
| | | |
| | | |
− | <script>localStorage.clear();</script>
| + | <script>localStorage.clear();</script> |
− | <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
| + | <!-- 最新的 Bootstrap 核心 JavaScript 文件 --> |
− | <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"
| + | <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" |
− | integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
| + | integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" |
− | crossorigin="anonymous"></script>
| + | crossorigin="anonymous"></script> |
| | | |
− | <script type="text/javascript" async
| + | <script type="text/javascript" async |
− | src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_CHTML"></script>
| + | src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_CHTML"></script> |
− | <script type="text/x-mathjax-config">
| + | <script type="text/x-mathjax-config"> |
− | MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
| + | MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}}); |
| | | |
− | </script>
| |
| | | |
− | <script type="text/javascript">
| |
− | $("#category_navbar a").on('click', function (event) {
| |
− | // Make sure this.hash has a value before overriding default behavior
| |
− | if (this.hash !== "") {
| |
− | // Prevent default anchor click behavior
| |
− | event.preventDefault();
| |
| | | |
− | // Store hash0
| + | |
− | var hash = this.hash;
| + | </script> |
| | | |
− | // Using jQuery's animate() method to add smooth page scroll
| + | <script type="text/javascript"> |
− | // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
| + | |
− | $('html, body').animate({
| + | |
− | scrollTop: $(hash).offset().top
| + | |
− | }, 800, function () {
| + | |
| | | |
− | // Add hash (#) to URL when done scrolling (default click behavior)
| + | $(document).ready(function () { |
− | window.location.hash = hash;
| + | $("#category_navbar a").on('click', function (event) { |
− | });
| + | // Make sure this.hash has a value before overriding default behavior |
− | } // End if
| + | if (this.hash !== "") { |
− | });
| + | // Prevent default anchor click behavior |
| + | event.preventDefault(); |
| | | |
− | </script>
| + | // Store hash0 |
| + | var hash = this.hash; |
| + | |
| + | // Using jQuery's animate() method to add smooth page scroll |
| + | // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area |
| + | $('html, body').animate({ |
| + | scrollTop: $(hash).offset().top |
| + | }, 800, function () { |
| + | |
| + | // Add hash (#) to URL when done scrolling (default click behavior) |
| + | window.location.hash = hash; |
| + | }); |
| + | } // End if |
| + | }); |
| + | }); |
| + | |
| + | |
| + | </script> |
| | | |
| </head> | | </head> |
− | <body> | + | </head> |
− | <div class="backgroundpic">
| + | |
− | <img src="https://static.igem.org/mediawiki/2016/e/e5/T--TAS_Taipei--Taipei_Background_1.0.jpg" width="100%" height="100%" id="bg" alt="">
| + | <body data-spy="scroll" data-target="#category_navbar"> |
− | </div>
| + | |
| + | <div class="container" style='z-index:10;position:relative;'> |
| + | |
| + | |
| + | <div class="row card" id='bodycontainer' class='row'> |
| + | |
| + | <nav class="navbar navbar-default navbar-static-top"> |
| + | <!-- Brand and toggle get grouped for better mobile display --> |
| + | <div class="navbar-header"> |
| + | <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" |
| + | data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> |
| + | <span class="sr-only">Toggle navigation</span> |
| + | <span class="icon-bar"></span> |
| + | <span class="icon-bar"></span> |
| + | <span class="icon-bar"></span> |
| + | </button> |
| + | <a class="navbar-brand" href="#"><img |
| + | src="https://static.igem.org/mediawiki/2017/8/8c/%E5%91%80%E5%95%8A%E5%93%88.jpeg" width="100"></a> |
| + | </div> |
| + | |
| + | <!-- Collect the nav links, forms, and other content for toggling --> |
| + | <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> |
| + | <ul class="nav navbar-nav"> |
| + | <li><a href="/Team:SDSZ-China">Home</a></li> |
| + | <li><a href="/Team:SDSZ-China/Project">Project</a></li> |
| + | <li><a href="/Team:SDSZ-China/Experiment">Experiment</a></li> |
| + | <li><a href="/Team:SDSZ-China/Parts">Parts</a></li> |
| + | <li><a href="/Team:SDSZ-China/Human_Practices">Human Practices</a></li> |
| + | <li><a href="/Team:SDSZ-China/Safety">Safety</a></li> |
| + | <li><a href="/Team:SDSZ-China/Hardware"> Hardware </a></li> |
| + | |
| + | </ul> |
| + | <ul class="nav navbar-nav navbar-right"> |
| + | <li><a href="/Team:SDSZ-China/Team">Team and attributions</a></li> |
| + | <li><a href="#">By SDSZ</a></li> |
| + | </ul> |
| + | </div><!-- /.navbar-collapse --> |
| + | </nav> |
| + | |
| + | |
| + | <div class="col-sm-12" style="padding-right:5%"> |
| + | |
| + | <br> |
| + | <br> |
| + | |
| + | <div class="text-center"> |
| + | <h1 class="text-danger">SDSZ - China</h1> |
| + | <h4 class="text-default">Automatic Synthesize of UDCA(effective ingredient of bear bile) using immobilized enzymes.</h4> |
| + | </div> |
| + | |
| + | <br> |
| + | <br> |
| + | <br> |
| + | <br> |
| + | <br> |
| + | <br> |
| + | </div> |
| + | </div> |
| + | |
| + | <div class="backgroundpic"> |
| + | <img src="https://static.igem.org/mediawiki/2017/6/62/%E8%83%8C%E6%99%AF1.jpeg" width="100%" |
| + | height="100%" id="bg" alt=""> |
| + | </div> |
| + | </div> |
| + | |
| </body> | | </body> |
| + | |
| </html> | | </html> |