(Prototype team page) |
|||
(8 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
{{SJTU-Software}} | {{SJTU-Software}} | ||
− | <html> | + | <html lang="en"> |
+ | <head> | ||
+ | <meta charset="utf-8" /> | ||
+ | <meta http-equiv="X-UA-Compatible" content="IE=edge" /> | ||
+ | <meta name="viewport" content="width=device-width, initial-scale=1" /> | ||
+ | <meta name="description" content="Free Bootstrap Themes by Html5xCss3 dot com - Free Responsive Html5 Templates"> | ||
+ | <meta name="author" content="#"> | ||
+ | <title>SJTU-Software_Attributions</title> | ||
+ | <!-- Bootstrap Core CSS --> | ||
+ | <link href="https://cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"> | ||
+ | <!-- Custom CSS --> | ||
+ | <style type="text/css"> | ||
+ | /* ==== Google font ==== */ | ||
+ | @charset "UTF-8"; | ||
+ | @import url(http://fonts.googleapis.com/css?family=PT+Sans:700|Pacifico|Changa+One); | ||
+ | @import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,900'); | ||
+ | @import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,700,900'); | ||
+ | @import url('https://fonts.googleapis.com/css?family=Montserrat:400,700,900'); | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* ------------------------------------Html-Body------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | body {font-family: 'Source Sans Pro', sans-serif;font-weight: 400;color: #666;background-color: #fff;font-size: 15px;line-height: 24px;hyphens: auto;overflow-wrap: break-word;} | ||
+ | html, body {width:100%; padding:0; margin:0;} | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | html { -webkit-text-size-adjust: none;} | ||
+ | .video embed,.video object,.video iframe { width: 100%; height: auto;} | ||
+ | img{max-width:100%; height: auto;width: auto\9; /* ie8 */} | ||
− | + | h1 {font-size: 38px;} | |
− | + | h2 {font-size: 36px;} | |
− | + | h3 {font-size: 32px;} | |
− | + | h4 {font-size: 28px;} | |
− | + | h5 {font-size: 24px;} | |
− | + | h6 {font-size: 20px;} | |
+ | h1,h2,h3,h4,h5,h6 {font-weight: 700;color: #111;line-height: 1.1;font-family: 'Montserrat', sans-serif;} | ||
+ | p {margin: 0 0 20px;} | ||
+ | a {color: #333;-webkit-transition: all .2s ease-in-out;-moz-transition: all .2s ease-in-out;transition: all .2s ease-in-out;} | ||
+ | a:hover, | ||
+ | a:focus {text-decoration: none;color:#EC495E;} | ||
− | + | button {border: none;outline: 0;} | |
− | + | ul li{list-style: none;} | |
+ | input:not([type]), input[type="color"], input[type="email"], input[type="number"], input[type="password"], input[type="tel"], input[type="url"], input[type="text"], input[type="search"], textarea, .form-control, select { | ||
+ | height: 40px; | ||
+ | padding-left: 20px; | ||
+ | border: 1px solid #ccc; | ||
+ | border-radius: 0; | ||
+ | box-shadow: none; | ||
+ | line-height: 22px; | ||
+ | letter-spacing: .5px; | ||
+ | -webkit-transition: border-color 0.5s; | ||
+ | transition: border-color 0.5s; | ||
+ | } | ||
+ | .form-control:focus, .form-control:hover { | ||
+ | outline: none; | ||
+ | box-shadow: none; | ||
+ | border-color: #666; | ||
+ | } | ||
+ | /* --Line-- */ | ||
+ | hr.line { margin: 15px auto; padding: 0; max-width: 90px;border: 0; border-top: solid 5px #ddd;text-align: center;} | ||
− | + | /* --Progress-- */ | |
− | + | .progress{background-color: rgba(0, 0, 0, .3); height: 15px;box-shadow: none;} | |
− | + | .progress-bar{box-shadow: none;line-height: 15px;} | |
+ | .progress-bar-light{background-color: #f2f2f2; color: #262626;} | ||
+ | .progress-bar-yellow {background-color: #333856;} | ||
+ | .progress-bar-dark {background-color: #262626;} | ||
− | + | /* --no-gutter-- */ | |
+ | .no-gutter::after, .no-gutter::before {content: " ";display: table;} | ||
+ | .no-gutter::after {clear: both;} | ||
+ | .no-gutter{margin: 0 !important;} | ||
+ | .no-gutter > [class*=col-] { | ||
+ | padding-right: 0; | ||
+ | padding-left: 0; | ||
+ | } | ||
+ | .copyrights{ | ||
+ | text-indent:-9999px; | ||
+ | height:0; | ||
+ | line-height:0; | ||
+ | font-size:0; | ||
+ | overflow:hidden; | ||
+ | } | ||
+ | /* --Socials-nav-- */ | ||
+ | .social-link{text-align: center;} | ||
+ | .social-link li{} | ||
+ | .social-link li a{height: 37px; width: 37px;border-radius: 50%;display:block;color: #333;font-size: 19px;padding-top: 6px;border: 1px solid #333;background: #fff;} | ||
+ | .social-link li a:hover{background: transparent;color: #fff;border: 1px solid #fff;} | ||
+ | /* --Page-- */ | ||
+ | body.index-page {} | ||
+ | body.single-page {} | ||
+ | body.single-page .portfolio-box {max-width: 100%;margin: 20px 0;} | ||
− | + | body .wrap-body { | |
+ | background-image: url(https://static.igem.org/mediawiki/2017/e/ea/SJTU-Software_background_darker.jpeg); | ||
+ | background-position: center center; | ||
+ | background-repeat: no-repeat; | ||
+ | background-attachment: fixed; | ||
+ | background-size: cover; | ||
+ | overflow: hidden; | ||
+ | position: relative; | ||
+ | height: 100%; | ||
+ | } | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* ------------------------------------Header---------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | #intro {font-family: "Changa One", cursive;font-weight: 400;position: relative;margin: 80px auto;width: 600px;font-size: 60px;text-align: center;color: rgba(255,255,255,0.7);} | ||
+ | #intro span {display: block;line-height: 1.3} | ||
− | + | .line-1 {position: relative;} | |
− | + | .line-1:before, .line-1:after {content: "";font-family: FontAwesome;position: relative;font-style: normal;font-weight: normal;text-decoration: inherit;font-size: 16px;margin: 0 30px;top: -5px;} | |
− | + | .line-2 {font-family: "Changa One", sans-serif;font-weight: 400;text-transform: uppercase;font-size: 90px;letter-spacing: 15px;margin: 0 0;} | |
− | + | .line-3 {font-family: "PT Sans", sans-serif;font-weight: 700;font-size: 16px;text-transform: uppercase;margin: 70px 0 0;position: relative;letter-spacing: 6px;} | |
− | + | .line-3:before, .line-3:after {content: " ";position: absolute;width: 50px;height: 5px;border-top: 1px solid #fff;border-bottom: 1px solid #fff;} | |
− | + | .line-3:before {margin: 7px 0 0 -60px;} | |
+ | .line-3:after {margin: 7px 0 0 10px;} | ||
+ | .line-4 {position: relative;text-align: center;margin: 50px auto;display: block;font-size: 20px;} | ||
+ | .line-4 a {text-decoration: none;display: inline-block;text-align: left;color: #fff;} | ||
+ | .line-4 a:nth-child(1) {text-align: right;} | ||
+ | .line-4 a:nth-child(1):after {content: "";font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit;position: relative;font-size: 30px;text-align: center;width: 90%;top: 4px;margin: 0;padding: 0 20px;} | ||
+ | @media(max-width:992px){ | ||
+ | #intro{width: 500px;} | ||
+ | .line-1{font-size: 25px;} | ||
+ | .line-2{font-size: 80px;letter-spacing: 12px;} | ||
+ | .line-3{font-size: 14px;margin: 60px 0 0;letter-spacing: 4px;} | ||
+ | .line-3:before, .line-3:after {width: 40px;} | ||
+ | .line-3:before {margin: 5px 0 0 -50px;} | ||
+ | .line-3:after {margin: 5px 0 0 10px;} | ||
+ | .line-4{font-size: 18px;margin: 40px auto;} | ||
+ | } | ||
− | + | @media(max-width:767px){ | |
− | + | #intro{width: 350px;} | |
+ | .line-1{font-size: 20px;} | ||
+ | .line-2{font-size: 70px;letter-spacing: 10px;} | ||
+ | .line-3{font-size: 13px;margin: 50px 0 0;letter-spacing: 3px;} | ||
+ | .line-3:before, .line-3:after {width: 30px;} | ||
+ | .line-3:before {margin: 4px 0 0 -40px;} | ||
+ | .line-3:after {margin: 4px 0 0 10px;} | ||
+ | .line-4{font-size: 16px;margin: 30px auto;} | ||
+ | } | ||
− | + | @media(max-width:500px){ | |
− | + | #intro{width: 250px;} | |
− | + | .line-1{font-size: 17px;} | |
− | + | .line-2{font-size: 50px;letter-spacing: 8px;} | |
− | + | .line-3{font-size: 12px;margin: 40px 0 0;letter-spacing: 3px;} | |
− | + | .line-3:before, .line-3:after {width: 20px;} | |
− | + | .line-3:before {margin: 4px 0 0 -30px;} | |
− | + | .line-3:after {margin: 4px 0 0 10px;} | |
− | + | .line-4{font-size: 15px;margin: 20px auto;} | |
− | + | .line-4 a:nth-child(1):after {font-size: 25px;} | |
− | + | } | |
− | + | ||
− | + | ||
+ | header.page-header{} | ||
− | + | /* ---------------------------------------------------------------------------- */ | |
+ | /* -------------------------------------Content-------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | #page-content{background: #fff;} | ||
− | + | /* ---HomePage--- */ | |
+ | .box-content {} | ||
− | + | .box-content.box-style-0{background-image: url(../images/patftern-white2.png); background-color: #fff;} | |
− | + | .box-content.box-style-1{background: url(../images/pattern-white.png) center center;background-size: cover; background-color: #fff;} | |
− | + | .box-content.box-style-2{background-image: url(../images/home-6.png);background-position: 80% top;background-repeat: no-repeat;background-color: #F8F9F1;} | |
− | + | .box-content.box-style-3{background: url(../images/ep_naturalblack.png) fixed center center;color:#fff;} | |
− | + | ||
+ | /* ---Heading--- */ | ||
+ | .heading{margin-bottom: 60px;position:relative;display:block; width: 100%;} | ||
+ | .heading h2{font-weight: 400;font-size: 55px;letter-spacing: 0px;line-height: 50px;text-transform: uppercase;} | ||
+ | .heading:after{position: absolute; content: "";width: 40px;height: 4px;background: #333856;left: 0;right: auto;bottom: -30px;} | ||
+ | .box-text.dark-style .heading:after{background: #fff;} | ||
+ | .box-text .t-right .heading:after{right: 0; left: auto;} | ||
+ | @media(max-width:767px){ | ||
+ | .heading{margin-bottom: 40px;} | ||
+ | .heading h2{font-size: 48px;line-height: 45px;margin-top: 0;} | ||
+ | .heading:after{left: calc(50% - 20px);bottom: -20px;} | ||
+ | .box-text .t-right .heading:after{right: calc(50% - 20px); bottom: -20px;} | ||
+ | } | ||
− | + | @media(max-width:500px){ | |
+ | .heading h2{font-size: 43px;line-height: 40px;margin-top: 0;} | ||
+ | } | ||
− | + | /* ---------------------------------------------------------------------------- */ | |
− | + | /* ------------------------------------Menu------------------------------------ */ | |
− | + | /* ---------------------------------------------------------------------------- */ | |
− | + | #menu {border-radius: 0;text-transform: uppercase;border: none;} | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | #menu a.navbar-brand:hover{color: #fff;} | |
+ | #menu .navbar-brand{margin: 0;height: auto;text-transform: uppercase;padding: 0px 18px;} | ||
+ | #menu .logo {} | ||
+ | #menu .dropdown-menu {background-color: #2B2D3F;border:none;border-radius: 0;} | ||
− | + | #menu .navbar-collapse{padding: 0;background: rgba(255, 255, 255, 0.2)} | |
+ | #menu ul.nav .dropdown-menu li a{color: #fff;} | ||
+ | #menu ul.nav .dropdown-menu li a:hover{color: #ec495e;} | ||
+ | #menu .dropdown-inner {display: table;} | ||
+ | #menu .dropdown-inner ul {display: table-cell;} | ||
+ | #menu .dropdown-inner a {min-width: 160px;display: block;padding: 3px 20px;clear: both;line-height: 20px;color: #000;margin: 0 5px;} | ||
+ | #menu li.dropdown:hover>a, #menu li.dropdown:focus>a, #menu li.dropdown:active>a{color: #ec495e;background: none;} | ||
+ | .navbar{margin: 0;} | ||
+ | #menu ul.nav li{} | ||
+ | #menu ul.nav li a{padding: 18px 45px;color: #fff;letter-spacing: 2px;font-size: 14px;background-color: transparent;font-weight: 700;} | ||
+ | #menu ul.nav li.active a{background: #fff;color: #1e252d;} | ||
+ | #menu ul.nav li.dropdown a{} | ||
+ | #menu .nav > li > a:hover, #menu .nav > li > a:focus{color:#fff;background-color: rgba(255, 255, 255, 0.2);} | ||
− | + | #menu .btn-navbar {font-size: 20px;color: #FFF;padding: 4px 12px;float: right;border: 2px solid #fff;} | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | @media(max-width:767px) { | |
+ | #menu{background: #1D2027;padding: 10px 0;} | ||
+ | #menu .navbar-brand {display: block;color: #fff;margin-top: 10px;} | ||
+ | #menu div.dropdown-inner > ul.list-unstyled {display: block;} | ||
+ | #menu .dropdown-inner a {width: 100%;color: #fff;} | ||
+ | #menu div.dropdown-menu {margin-left: 0 !important; padding-bottom: 10px;background-color: rgba(0, 0, 0, 0.1);} | ||
− | + | #heading{display: inline-block !important;color: #fff;font-weight: bold;font-size: 22px;margin: 10px 0 8px 15px;} | |
+ | } | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* -------------------------------------Box 1---------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | .box-content.box-1 {} | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* -------------------------------------Box 2---------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | .box-content.box-2 {} | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* -------------------------------------Box 3---------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | .box-content.box-3 {} | ||
− | </div> | + | |
+ | |||
+ | |||
+ | /* ---Article--- */ | ||
+ | article.single-post{padding-bottom: 0;} | ||
+ | |||
+ | article{background: #ffffff; color: #3F3F3F; margin: 50px 0;border-bottom: 1px solid #e1e1e1;padding-bottom: 50px;} | ||
+ | article:last-child{border-bottom: none;} | ||
+ | article:after, article:before{clear: both; content: '\0020'; display: block; visibility: hidden; width: 0; height: 0;} | ||
+ | article .post-thumbnail-wrap {text-align: center;width: 100%;margin-bottom: 10px;} | ||
+ | article .post-thumbnail-wrap img {} | ||
+ | article h2.entry-title{font-size: 35px;margin: 20px 0 10px;font-weight: 300;} | ||
+ | article h2.entry-title a{color: #131313;} | ||
+ | article h2.entry-title a:hover{color: #555} | ||
+ | |||
+ | article .entry-header{margin-bottom: 30px;} | ||
+ | article.single-post .entry-header{margin-bottom: 60px;} | ||
+ | article.single-post .entry-header h1.entry-title{font-size: 40px;line-height: 30px;letter-spacing: 2px;font-weight: 600;margin: 0;text-transform: uppercase;margin-bottom: 40px;line-height: 1.1} | ||
+ | article.single-post .entry-header h1.entry-title a {color: #575756;margin: 0;} | ||
+ | article .entry-title-blog a:hover {color: #628d7c;} | ||
+ | |||
+ | article .entry-header .entry-meta{color: #777;font-size: 13px;} | ||
+ | article .entry-header .entry-meta a {color: #777;} | ||
+ | article .entry-header .entry-meta a:hover {color: #EC495E;} | ||
+ | |||
+ | article .entry-content{margin-top: 30px;} | ||
+ | article.single-post .entry-content{ padding: 20px 100px;} | ||
+ | |||
+ | article .entry-content p{color: #686868;} | ||
+ | article .entry-content blockquote {border-left: 3px solid #1c7791;margin: 0 50px;font-style: italic;color: #666;padding-left: 20px;} | ||
+ | article .entry-content ol {text-align: justify;margin: 10px 50px;list-style-type: circle;} | ||
+ | |||
+ | .comments-are {padding:30px 20px; position: relative;} | ||
+ | .comments-are{border-top: 1px solid #e1e1e1;margin: 50px 0 ;} | ||
+ | .comments-are textarea {height:170px;} | ||
+ | |||
+ | @media(max-width:767px){ | ||
+ | article.single-post .entry-content{ padding: 20px 80px;} | ||
+ | } | ||
+ | |||
+ | @media(max-width:500px){ | ||
+ | article.single-post .entry-content{ padding: 10px 30px;font-size: 14px;} | ||
+ | article .entry-content p{} | ||
+ | article .entry-content blockquote {margin: 0;padding-left: 10px;} | ||
+ | article .entry-content ol {margin: 10px 0;} | ||
+ | } | ||
+ | |||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* ------------------------------------Footer---------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | footer{color: #fff;} | ||
+ | footer ul {padding: 0;margin-top: 10px;} | ||
+ | footer a {color: #fff;} | ||
+ | footer a:hover {color: #ddd;} | ||
+ | |||
+ | footer .wrap-footer{background: #fff;} | ||
+ | footer .wrap-footer p{color: #fff !important; font-size: 16px !important;} | ||
+ | |||
+ | footer .bottom-footer{padding: 40px 0 60px;font-weight: bold;} | ||
+ | footer .quicklinks{} | ||
+ | footer .quicklinks li{position: relative;padding-right: 20px;margin-right: 7px;} | ||
+ | footer .quicklinks li:last-child{padding-right: 0;margin-right: 0;} | ||
+ | footer .quicklinks li:last-child:after{display: none;} | ||
+ | footer .quicklinks li:after{position: absolute;bottom: 10px;right: 0;content: ""; height: 5px; width: 5px; background-color: #333856;} | ||
+ | |||
+ | footer .contact-info{position:relative} | ||
+ | |||
+ | footer .contact-info .show-info-link{display:inline-block;position:absolute;top:-50px;left:0;right:0;margin:0 auto;padding-left:25px;padding-right:25px;width:200px;height:50px;text-align:center;color:#111;background:#fff;opacity:0;visibility:hidden;-webkit-transition:opacity 0.5s, visibility 0.6s, top 0.5s;transition:opacity 0.5s, visibility 0.6s, top 0.5s;z-index:999} | ||
+ | footer .contact-info .show-info-link:hover{background:#ececec} | ||
+ | footer .contact-info .show-info-link:focus{text-decoration:none !important;border-bottom:none} | ||
+ | |||
+ | footer .contact-info .show-info-link i{display:inline-block;padding-top:18px;padding-right:15px;} | ||
+ | |||
+ | footer .contact-info .info-open{top:0;opacity:1;visibility:visible} | ||
+ | footer .contact-info .contact-info-wrapper{position:absolute;margin-bottom:0;padding:100px 60px 0 90px;top:0;left:0;width:100%;height:100%;background:rgba(15, 15, 15, 0.90);-webkit-transition:opacity 0.5s, visibility 0.6s;transition:opacity 0.5s, visibility 0.6s} | ||
+ | footer .contact-info .contact-info-wrapper ul{list-style:none;padding:0;margin:0;width:50%;float:left} | ||
+ | footer .contact-info .contact-info-wrapper ul li{display:block;margin-bottom:30px;padding:7px 0 7px 20px;border-left:1px solid #666} | ||
+ | footer .contact-info .contact-info-wrapper ul li .adr-heading{display:block;color:#ececec;font-size: 16px;} | ||
+ | footer .contact-info .contact-info-wrapper ul li .adr-info{font-size: 15px;letter-spacing:1.5px;text-transform:uppercase;color:#888} | ||
+ | footer .contact-info .contact-info-wrapper .show-map{display:block;position:absolute;bottom:100px;color:#ececec} | ||
+ | footer .contact-info .contact-info-wrapper .show-map i{display:inline-block;padding-top:18px;padding-right:15px; font-size: 22px;} | ||
+ | footer .contact-info .contact-info-wrapper .show-map:hover{color:#999} | ||
+ | footer .contact-info .contact-info-wrapper .show-map:focus{text-decoration:none} | ||
+ | footer .map-open{opacity:0;visibility:hidden} | ||
+ | /* .footer-contact .contact-form{padding:70px;} */ | ||
+ | footer .contact-form .heading{} | ||
+ | footer .contact-form .form-group label {font-size: 13px;text-transform: uppercase;font-weight: 700;letter-spacing: 2px;color: #111;} | ||
+ | |||
+ | @media(max-width:767px){ | ||
+ | footer .contact-info .contact-info-wrapper ul {display: block;width: 100%;} | ||
+ | } | ||
+ | |||
+ | @media(max-width:500px){ | ||
+ | footer .contact-info .contact-info-wrapper {padding: 70px 30px 0 60px;} | ||
+ | footer .contact-info .contact-info-wrapper .show-map{bottom: 70px;} | ||
+ | } | ||
+ | |||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* ------------------------------Contact Form---------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | #contactForm{margin-top: 100px} | ||
+ | #contactForm textarea{height: 150px;} | ||
+ | |||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* ------------------------------Portfolio Box--------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | .portfolio-box {display: block;position: relative;margin: auto;overflow: hidden;max-width: 500px} | ||
+ | |||
+ | /****** Zoom Effect ******/ | ||
+ | .portfolio-box.zoom-effect .portfolio-box-caption{background: rgba(0, 0, 0,.45);} | ||
+ | .portfolio-box.zoom-effect img{-webkit-transition: 0.5s ease;transition: 0.5s ease;} | ||
+ | .portfolio-box:hover.zoom-effect img{-webkit-transform:scale(1.1); /* Safari and Chrome */-moz-transform:scale(1.1); /* Firefox */-ms-transform:scale(1.1); /* IE 9 */-o-transform:scale(1.1); /* Opera */transform:scale(1.1);} | ||
+ | |||
+ | .portfolio-box .portfolio-box-caption {display: block;position: absolute;bottom: 0;width: 100%;height: 100%;text-align: center;color: #fff;-webkit-transition: all .35s;-moz-transition: all .35s;transition: all .35s;} | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content {position: absolute;top: 50%;width: 100%;text-align: center;transform: translateY(-50%);} | ||
+ | |||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-social, | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category, | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {padding: 0 15px;text-transform: uppercase;font-weight: 600;letter-spacing: 2px;} | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {font-size: 13px;color: #333856;margin-bottom: 10px;} | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {font-size: 16px;margin-bottom: 3px;} | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-social{transition: all 1s ease;opacity: 0; height: 0;overflow: hidden;} | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-social i.fa{font-size: 25px;} | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-social ul li{margin: 20px 5px 0;} | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-social ul li a{display: block;width: 48px;height: 48px;color: #333856;background: #fff;transition-duration: 0.3s;padding-top: 12px;border-radius: 50%;text-shadow: none;} | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-social ul li a:hover{color: #fff;background-color: #333856;} | ||
+ | |||
+ | .portfolio-box:hover .portfolio-box-caption {opacity: 1;background: none;} | ||
+ | .portfolio-box:hover .portfolio-box-caption .portfolio-box-caption-content .project-social{opacity: 1;height: auto;} | ||
+ | .portfolio-box:hover .portfolio-box-caption .portfolio-box-caption-content .project-category, | ||
+ | .portfolio-box:hover .portfolio-box-caption .portfolio-box-caption-content .project-name{display: none;} | ||
+ | |||
+ | @media(min-width:768px) { | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {font-size: 15px;} | ||
+ | .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {font-size: 19px;} | ||
+ | } | ||
+ | |||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* ------------------------------------Button---------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | .btn {border-radius: 0;outline: none;text-decoration: none;text-transform: uppercase;font-weight: bold;box-shadow: none;border: none;} | ||
+ | .btn:focus, | ||
+ | .btn.active, | ||
+ | .btn:active {background-image: none;box-shadow: none;outline: 0 none;} | ||
+ | |||
+ | .btn-skin {padding: 11px 22px;color: #1a1c1e;border: 2px solid #1a1c1e;font-size: 15px; letter-spacing: 2.3px;font-weight: 700;background: #fff;margin: 10px 0;} | ||
+ | .btn-skin i.fa{padding-left: 5px;} | ||
+ | .btn-skin:hover, .btn-skin:focus {color: #fff;background-color: #1a1c1e;} | ||
+ | |||
+ | @media (max-width: 500px){ | ||
+ | .btn-skin {padding: 8px 20px;font-size: 14px; letter-spacing: 1.8px;font-weight: 600} | ||
+ | } | ||
+ | |||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* -----------------------------------Success---------------------------------- */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | .success{height: 500px;width: 100%;text-transform: uppercase;} | ||
+ | .success-insite {position: relative;top: 50%;left: 50%;transform: translate(-50%, -50%);} | ||
+ | .success span.fail{font-size: 50px; color: red;display: block;line-height: 55px;} | ||
+ | .success span.success{font-size: 50px; color: blue;display: block;line-height: 55px;} | ||
+ | .success .btn-skin{margin-top: 50px} | ||
+ | |||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* ----------------------------------Margin------------------------------------ */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | .m-top10 { margin-top: 10px;} | ||
+ | .m-top15 { margin-top: 15px;} | ||
+ | .m-top20 { margin-top: 20px;} | ||
+ | .m-top30 { margin-top: 30px;} | ||
+ | .m-top50 { margin-top: 50px;} | ||
+ | .m-top80 { margin-top: 100px;} | ||
+ | .m-top100 { margin-top: 80px;} | ||
+ | .m-top120 { margin-top: 120px;} | ||
+ | |||
+ | .m-bot10 { margin-bottom: 10px;} | ||
+ | .m-bot15 { margin-bottom: 15px;} | ||
+ | .m-bot20 { margin-bottom: 20px;} | ||
+ | .m-bot30 { margin-bottom: 30px;} | ||
+ | .m-bot50 { margin-bottom: 50px;} | ||
+ | .m-bot80 { margin-bottom: 80px;} | ||
+ | .m-bot120 { margin-bottom: 120px;} | ||
+ | |||
+ | .pd-exlarge-xs{padding: 100px 90px;} | ||
+ | .pd-large-xs{padding: 80px 70px;} | ||
+ | .pd-medium-xs{padding: 60px 50px;} | ||
+ | .pd-small-xs{padding: 40px 30px;} | ||
+ | |||
+ | @media only screen and (min-width: 768px) { | ||
+ | .pd-exlarge-sm{padding: 100px 90px;} | ||
+ | .pd-large-sm{padding: 80px 70px;} | ||
+ | .pd-medium-sm{padding: 60px 50px;} | ||
+ | .pd-small-sm{padding: 40px 30px;} | ||
+ | } | ||
+ | @media only screen and (min-width: 992px) { | ||
+ | .pd-exlarge-md{padding: 100px 90px;} | ||
+ | .pd-large-md{padding: 80px 70px;} | ||
+ | .pd-medium-md{padding: 60px 50px;} | ||
+ | .pd-small-md{padding: 40px 30px;} | ||
+ | } | ||
+ | @media only screen and (min-width: 1200px) { | ||
+ | .pd-exlarge-lg{padding: 100px 90px;} | ||
+ | .pd-large-lg{padding: 80px 70px;} | ||
+ | .pd-medium-lg{padding: 60px 50px;} | ||
+ | .pd-small-lg{padding: 40px 30px;} | ||
+ | } | ||
+ | |||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* --------------------------------Triangle------------------------------------ */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | .triangle-left, | ||
+ | .triangle-right{position: relative;} | ||
+ | |||
+ | .triangle-left::before {border-bottom: 30px solid transparent;border-right: 30px solid #fff;border-top: 30px solid transparent;content: " ";height: 0;width: 0;left: -30px;position: absolute;top: calc(50% - 30px);} | ||
+ | .triangle-right::before {border-bottom: 30px solid transparent;border-left: 30px solid #fff;border-top: 30px solid transparent;content: " ";height: 0;width: 0;position: absolute;right: -30px;top: calc(50% - 30px);} | ||
+ | @media (max-width: 767px){ | ||
+ | .triangle-left::before {left: calc(50% - 30px);top: -45px;transform: rotate(90deg);} | ||
+ | .triangle-right::before {right: calc(50% - 30px);position: absolute;top: -45px;transform: rotate(-90deg);} | ||
+ | } | ||
+ | |||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | /* --------------------------------Flex-Box------------------------------------ */ | ||
+ | /* ---------------------------------------------------------------------------- */ | ||
+ | .flex-box .box-text, | ||
+ | .flex-box .box-image {background-repeat: no-repeat;background-position: center center;background-size: cover;display: block;width: 100%;height: 100%;} | ||
+ | |||
+ | /* Box Text */ | ||
+ | .flex-box .box-text {-moz-justify-content: center;-webkit-justify-content: center;-ms-justify-content: center;justify-content: center;-moz-align-items: center;-webkit-align-items: center;-ms-align-items: center;align-items: center;/* display: flex; */} | ||
+ | .flex-box .box-text .box-text-inner{margin: 0 auto;max-width: 100%;} | ||
+ | .flex-box .box-text .box-text-inner p{font-size: 18px;font-weight: 300;color: #000;} | ||
+ | .flex-box .box-text .title {} | ||
+ | .flex-box .box-text .title h3{font-weight: 700;color: #000;text-transform: uppercase;font-family: 'Playfair Display', serif;letter-spacing: 3px;} | ||
+ | .flex-box .box-text .title span{font-size: 24px; font-weight:800;color: #000;text-transform: uppercase;margin: 40px 0 20px;display: block;} | ||
+ | |||
+ | .flex-box .box-text.light-style{background: #fff;} | ||
+ | .flex-box .box-text.light-style .title h3{} | ||
+ | .flex-box .box-text.dark-style{background: #262626; color: #bbb;} | ||
+ | .flex-box .box-text.dark-style p{color: #ddd;} | ||
+ | .flex-box .box-text.dark-style .title h3{color: #333856;} | ||
+ | .flex-box .box-text.dark-style .heading h2{color: #fff;} | ||
+ | .flex-box .box-text.dark-style .social-link li a{color: #f2f2f2;border: 1px solid #f2f2f2;} | ||
+ | .flex-box .box-text.dark-style .social-link li a:hover{color: #000;border: 1px solid #333856;} | ||
+ | |||
+ | /* Box Image */ | ||
+ | .flex-box .box-image {width: 100%;height: 100%;display: inline-block;position: relative;} | ||
+ | .flex-box .box-image img {position: absolute;display: block;border-radius: 0;} | ||
+ | /* For browsers that support 'object-fit' */ | ||
+ | @supports ( object-fit: cover ) { | ||
+ | .flex-box .box-image img { | ||
+ | -moz-object-fit: cover; | ||
+ | -webkit-object-fit: cover; | ||
+ | -ms-object-fit: cover; | ||
+ | -o-object-fit: cover; | ||
+ | object-fit: cover; | ||
+ | -moz-object-position: center; | ||
+ | -webkit-object-position: center; | ||
+ | -ms-object-position: center; | ||
+ | object-position: center; | ||
+ | -ms-transform: none; | ||
+ | -moz-transform: none; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | } | ||
+ | } | ||
+ | @media(min-width:768px){ | ||
+ | .flex-box {-moz-align-items: stretch;-webkit-align-items: stretch;-ms-align-items: stretch;align-items: stretch;display: -moz-flex;display: -webkit-flex;display: -ms-flex;display: flex;-moz-flex-direction: row;-webkit-flex-direction: row;-ms-flex-direction: row;flex-direction: row;position: relative;overflow: hidden;} | ||
+ | .flex-box .f-right{order: 2;} | ||
+ | .box-text .t-right{text-align: right;} | ||
+ | } | ||
+ | @media(max-width:767px){ | ||
+ | .flex-box .box-text{text-align: center;} | ||
+ | .flex-box .box-image {height: 400px;width: 100%;} | ||
+ | } | ||
+ | @media(max-width:500px){ | ||
+ | .flex-box .box-text .box-text-inner p{font-size: 15px;} | ||
+ | } | ||
+ | </style> | ||
+ | |||
+ | |||
+ | <style type="text/css"> | ||
+ | /* Preload images */ | ||
+ | body:after { | ||
+ | content: url(../images/close.png) url(../images/loading.gif) url(../images/prev.png) url(../images/next.png); | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .lightboxOverlay { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | z-index: 9999; | ||
+ | background-color: black; | ||
+ | filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); | ||
+ | opacity: 0.8; | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .lightbox { | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | width: 100%; | ||
+ | z-index: 10000; | ||
+ | text-align: center; | ||
+ | line-height: 0; | ||
+ | font-weight: normal; | ||
+ | } | ||
+ | |||
+ | .lightbox .lb-image { | ||
+ | display: block; | ||
+ | height: auto; | ||
+ | max-width: inherit; | ||
+ | -webkit-border-radius: 3px; | ||
+ | -moz-border-radius: 3px; | ||
+ | -ms-border-radius: 3px; | ||
+ | -o-border-radius: 3px; | ||
+ | border-radius: 3px; | ||
+ | } | ||
+ | |||
+ | .lightbox a img { | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | .lb-outerContainer { | ||
+ | position: relative; | ||
+ | background-color: white; | ||
+ | *zoom: 1; | ||
+ | width: 250px; | ||
+ | height: 250px; | ||
+ | margin: 0 auto; | ||
+ | -webkit-border-radius: 4px; | ||
+ | -moz-border-radius: 4px; | ||
+ | -ms-border-radius: 4px; | ||
+ | -o-border-radius: 4px; | ||
+ | border-radius: 4px; | ||
+ | } | ||
+ | |||
+ | .lb-outerContainer:after { | ||
+ | content: ""; | ||
+ | display: table; | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
+ | .lb-container { | ||
+ | padding: 4px; | ||
+ | } | ||
+ | |||
+ | .lb-loader { | ||
+ | position: absolute; | ||
+ | top: 43%; | ||
+ | left: 0; | ||
+ | height: 25%; | ||
+ | width: 100%; | ||
+ | text-align: center; | ||
+ | line-height: 0; | ||
+ | } | ||
+ | |||
+ | .lb-cancel { | ||
+ | display: block; | ||
+ | width: 32px; | ||
+ | height: 32px; | ||
+ | margin: 0 auto; | ||
+ | background: url(../images/loading.gif) no-repeat; | ||
+ | } | ||
+ | |||
+ | .lb-nav { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | height: 100%; | ||
+ | width: 100%; | ||
+ | z-index: 10; | ||
+ | } | ||
+ | |||
+ | .lb-container > .nav { | ||
+ | left: 0; | ||
+ | } | ||
+ | |||
+ | .lb-nav a { | ||
+ | outline: none; | ||
+ | background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=='); | ||
+ | } | ||
+ | |||
+ | .lb-prev, .lb-next { | ||
+ | height: 100%; | ||
+ | cursor: pointer; | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .lb-nav a.lb-prev { | ||
+ | width: 34%; | ||
+ | left: 0; | ||
+ | float: left; | ||
+ | background: url(../images/prev.png) left 48% no-repeat; | ||
+ | filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); | ||
+ | opacity: 0; | ||
+ | -webkit-transition: opacity 0.6s; | ||
+ | -moz-transition: opacity 0.6s; | ||
+ | -o-transition: opacity 0.6s; | ||
+ | transition: opacity 0.6s; | ||
+ | } | ||
+ | |||
+ | .lb-nav a.lb-prev:hover { | ||
+ | filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | .lb-nav a.lb-next { | ||
+ | width: 64%; | ||
+ | right: 0; | ||
+ | float: right; | ||
+ | background: url(../images/next.png) right 48% no-repeat; | ||
+ | filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); | ||
+ | opacity: 0; | ||
+ | -webkit-transition: opacity 0.6s; | ||
+ | -moz-transition: opacity 0.6s; | ||
+ | -o-transition: opacity 0.6s; | ||
+ | transition: opacity 0.6s; | ||
+ | } | ||
+ | |||
+ | .lb-nav a.lb-next:hover { | ||
+ | filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | .lb-dataContainer { | ||
+ | margin: 0 auto; | ||
+ | padding-top: 5px; | ||
+ | *zoom: 1; | ||
+ | width: 100%; | ||
+ | -moz-border-radius-bottomleft: 4px; | ||
+ | -webkit-border-bottom-left-radius: 4px; | ||
+ | border-bottom-left-radius: 4px; | ||
+ | -moz-border-radius-bottomright: 4px; | ||
+ | -webkit-border-bottom-right-radius: 4px; | ||
+ | border-bottom-right-radius: 4px; | ||
+ | } | ||
+ | |||
+ | .lb-dataContainer:after { | ||
+ | content: ""; | ||
+ | display: table; | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
+ | .lb-data { | ||
+ | padding: 0 4px; | ||
+ | color: #ccc; | ||
+ | } | ||
+ | |||
+ | .lb-data .lb-details { | ||
+ | width: 85%; | ||
+ | float: left; | ||
+ | text-align: left; | ||
+ | line-height: 1.1em; | ||
+ | } | ||
+ | |||
+ | .lb-data .lb-caption { | ||
+ | font-size: 13px; | ||
+ | font-weight: bold; | ||
+ | line-height: 1em; | ||
+ | } | ||
+ | |||
+ | .lb-data .lb-number { | ||
+ | display: block; | ||
+ | clear: left; | ||
+ | padding-bottom: 1em; | ||
+ | font-size: 12px; | ||
+ | color: #999999; | ||
+ | } | ||
+ | |||
+ | .lb-data .lb-close { | ||
+ | display: block; | ||
+ | float: right; | ||
+ | width: 30px; | ||
+ | height: 30px; | ||
+ | background: url(../images/close.png) top right no-repeat; | ||
+ | text-align: right; | ||
+ | outline: none; | ||
+ | filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); | ||
+ | opacity: 0.7; | ||
+ | -webkit-transition: opacity 0.2s; | ||
+ | -moz-transition: opacity 0.2s; | ||
+ | -o-transition: opacity 0.2s; | ||
+ | transition: opacity 0.2s; | ||
+ | } | ||
+ | |||
+ | .lb-data .lb-close:hover { | ||
+ | cursor: pointer; | ||
+ | filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); | ||
+ | opacity: 1; | ||
+ | } | ||
+ | </style> | ||
+ | |||
+ | <!-- Custom Fonts --> | ||
+ | <link href="https://cdn.bootcss.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet"> | ||
+ | <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"> | ||
+ | |||
+ | |||
+ | <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> | ||
+ | <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> | ||
+ | <!--[if lt IE 9]> | ||
+ | <script src="js/html5shiv.js"></script> | ||
+ | <script src="js/respond.min.js"></script> | ||
+ | <![endif]--> | ||
+ | </head> | ||
+ | <body class="single-page"> | ||
+ | <div class="wrap-body"> | ||
+ | <!-- Intro --> | ||
+ | <div id="intro"> | ||
+ | <span class="line-1">SJTU</span> | ||
+ | <span class="line-2">Software</span> | ||
+ | <span class="line-3">BiobrickAssist Technology</span> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | <header id="page-header"> | ||
+ | <!--Navigation--> | ||
+ | <nav id="menu" class="navbar"> | ||
+ | <div class="container"> | ||
+ | <div class="row"> | ||
+ | <div class="navbar-header"><span id="heading" class="visible-xs">Categories</span> | ||
+ | <button type="button" class="btn btn-navbar navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"><i class="fa fa-bars"></i></button> | ||
+ | </div> | ||
+ | <div class="collapse navbar-collapse navbar-ex1-collapse"> | ||
+ | <ul class="nav navbar-nav"> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software">Home</a></li> | ||
+ | |||
+ | <li class="dropdown"> | ||
+ | <a href="#" class="dropdown-toggle" data-toggle="dropdown"> | ||
+ | Team <b class="caret"></b> | ||
+ | </a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/Team">Team</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/Collaborations">Collaborations</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | <li class="dropdown"> | ||
+ | <a href="#" class="dropdown-toggle" data-toggle="dropdown"> | ||
+ | Project <b class="caret"></b> | ||
+ | </a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/Description">Description</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/Design">Design</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/Contribution">Contribution</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/Improve">Improve</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/Demonstrate">Demonstrate</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/Attributions">Attributions</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | <li class="dropdown"> | ||
+ | <a href="#" class="dropdown-toggle" data-toggle="dropdown"> | ||
+ | Human Practice <b class="caret"></b> | ||
+ | </a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/HP/Silver">Silver HP</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/HP/Gold_Integrated">Integrated and Gold</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/Engagement">Public Engagement</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | <li><a href="https://2017.igem.org/Team:SJTU-Software/Safety">Safety</a></li> | ||
+ | |||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </nav> | ||
+ | </header> | ||
+ | |||
+ | <!-- /////////////////////////////////////////Content --> | ||
+ | <div id="page-content" class="container"> | ||
+ | <div class="row"> | ||
+ | <!-----------------Content--------------------> | ||
+ | <section class="box-content box-2 box-style-0"> | ||
+ | <div class="flex-box no-gutter"> | ||
+ | <div class="col-sm-12"> | ||
+ | <div class="box-text"> | ||
+ | <div class="box-text-inner pd-exlarge-lg pd-small-xs"> | ||
+ | <div class="heading"> | ||
+ | <h2>Attributions</h2> | ||
+ | </div> | ||
+ | |||
+ | <p> | ||
+ | First of all, we want to acknowledge all team members’ effort during the one-year preparation. | ||
+ | Four groups work hard and tightly so that we can achieve a satisfying outcome. | ||
+ | Here present the team group functions, their members’ work division and their achievements. | ||
+ | </p> | ||
+ | |||
+ | <h4>Program Group</h4> | ||
+ | <li> <b>Mingyu Liang</b>, backend programmer for Q/A </li> | ||
+ | <li> <b>Chenchao Ding</b>, backend programmer </li> | ||
+ | <li> <b>Yangzhen Wei</b>, frontend programmer for BAT and our wiki</li> | ||
+ | <li> <b>Zhenkai Ding</b>, frontend programmer </li> | ||
+ | <hr></hr> | ||
+ | |||
+ | <h4>Human Practice Group</h4> | ||
+ | <p> | ||
+ | Keep positively contact with other iGEM teams, reach collaborations with different organizations, like other universities, and biology companies. | ||
+ | <li> <b>Runzi Tan</b>, organize HP activities, arrange and report </li> | ||
+ | <li> <b>Kexin Xie</b>, collaboration and communication </li> | ||
+ | </p> | ||
+ | |||
+ | <hr></hr> | ||
+ | |||
+ | <h4>Copy Writer Practice Group</h4> | ||
+ | <p> | ||
+ | In charge of the documents writing of the wiki pages, posters, and the Giant Jamboree presentation, and also keep records of the team group meetings and progress. | ||
+ | <li> <b>Naiqiao Hou</b>, poster and presentation copywriting </li> | ||
+ | <li> <b>Chenyi Xie</b>, team records and wiki pages </li> | ||
+ | </p> | ||
+ | |||
+ | <hr></hr> | ||
+ | |||
+ | <h4>Design Group</h4> | ||
+ | <p> | ||
+ | Design the team logo and symbol, and beautify the wiki pages, the poster and the presentation PowerPoint to make them more clear and unstandable. | ||
+ | <li> <b>Xiaohan Chi</b></li> | ||
+ | <li> <b>Yiming Chen</b></li> | ||
+ | <li> <b>Zeshi Zhu</b></li> | ||
+ | </p> | ||
+ | |||
+ | <hr></hr> | ||
+ | |||
+ | <p> | ||
+ | Next, we received generous support and help within our school in order to ensure the project to go on wheels. | ||
+ | </p> | ||
+ | <h4>Instructors</h4> | ||
+ | <li><b>Dr. Chaochun Wei</b>, our Primary PI, offered us advice on our project and suggestions on our Human Practice</li> | ||
+ | <li><b>Dr. Feng Chen</b>, our Secondary PI, helped us with fundraising and offered us many suggestions on programming</li> | ||
+ | <li><b>Hongyu Ou</b>, our instructor, helped us find a good server and offered some technical support to our program</li> | ||
+ | |||
+ | <hr></hr> | ||
+ | |||
+ | <h4>College Support</h4> | ||
+ | <li>School of Life Science and Biotechnology</li> | ||
+ | <li>School of Chemistry and Chamical Engineering</li> | ||
+ | <li>School of Electronic Information and Electrical Engineering</li> | ||
+ | <li>School of Media & Design</li> | ||
+ | |||
+ | <hr></hr> | ||
+ | |||
+ | <h4>2016 SJTU-Software Team</h4> | ||
+ | <p> | ||
+ | The last year’s team shared their experience with us, and offered preparation suggestions based on the difficulties they encountered. | ||
+ | Especially the former team leader, Shiyu Fan, did much effort in selecting this year’s team member. | ||
+ | </p> | ||
+ | |||
+ | <hr></hr> | ||
+ | |||
+ | <h4>2015 SJTU-Software Team</h4> | ||
+ | <p>The program they made two years ago was the prototype of our project of this year. The efforts they devoted was really helpful to our improvement. | ||
+ | |||
+ | </p> | ||
+ | |||
+ | <p> | ||
+ | Besides, we also want to show our gratitude towards other universities’ iGEM teams and biology companies, which are involved in our HP activities and collaborations. | ||
+ | </p> | ||
+ | |||
+ | <h4>Fujian Agriculture and Forestry University (FAFU)</h4> | ||
+ | <p> | ||
+ | Organizer of the Conference of China iGEMer Community, inviting us as participants. | ||
+ | </p> | ||
+ | |||
+ | <h4>National Chiao Tung University (NCTU)</h4> | ||
+ | <p> | ||
+ | Organizer of the 5th iGEM Asia Conference, inviting us as participants. | ||
+ | </p> | ||
+ | |||
+ | <h4>University of Science and Technology of China (USTC)</h4> | ||
+ | <p> | ||
+ | Invited us to test their application and seed some feedbacks to them. They gave us suggestions on filtering biobricks. | ||
+ | </p> | ||
+ | |||
+ | <h4>Bluepha</h4> | ||
+ | <p> | ||
+ | Bluepha is a company that devoted to applying synthetic biology technology to industrial biological manufacturing. | ||
+ | One of their co-founders, Doc. Haoqian Zhang accepted our interview and discussed the present situation of synthetic biology industry in China based on our iGEM topic. | ||
+ | </p> | ||
+ | |||
+ | <h4>Yaoyanshe</h4> | ||
+ | <p> | ||
+ | Yaoyanshe APP is the first platform of pharmaceutical research and development industry and value sharing and trading. | ||
+ | The founder of Yaoyanshe gave advice on the future industry development in Biology and helped us to polish the idea of our project. | ||
+ | </p> | ||
+ | |||
+ | <h4>Novelbio Technology Company</h4> | ||
+ | <p> | ||
+ | Novelbio technology company is a company mainly focused on biological cloud computing. | ||
+ | The founder of Novelbio Technology Company, Jie Zong, analyzed the potential of biology software for us. | ||
+ | </p> | ||
+ | |||
+ | <hr></hr> | ||
+ | |||
+ | <b>It is because of your sincere devote and support that we achieved this all. Thanks again for your efforts!</b> | ||
+ | |||
+ | <img src="https://static.igem.org/mediawiki/2017/a/a5/SJTU-Software_Attribution_003.jpg"></img> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/e/e9/SJTU-Software_Attribution_001.jpg"></img> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/9/97/SJTU-Software_Attribution_002.jpg"></img> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </section> | ||
+ | </div> | ||
+ | </div> | ||
+ | <footer id="page-footer" class="footer-contact"> | ||
+ | <div class="wrap-footer container"> | ||
+ | <div class="row"> | ||
+ | <div class="flex-box no-gutter"> | ||
+ | <!-- Map and address --> | ||
+ | <div class="col-lg-12"> | ||
+ | <div class="contact-info"> | ||
+ | <!-- Show Info Button --> | ||
+ | <a href="#" class="show-info-link"><i class="fa fa-info"></i> Show info</a> | ||
+ | <div id="map" style="height: 550px;"></div> | ||
+ | <address class="contact-info-wrapper"> | ||
+ | <ul class="list-unstyled"> | ||
+ | <!-- Address --> | ||
+ | <li class="contact-group"> | ||
+ | <span class="adr-heading">Address</span> | ||
+ | <span class="adr-info">No. 800 Dongchuan Road, Minhang District, Shanghai, China</span> | ||
+ | </li> | ||
+ | <!-- Email --> | ||
+ | <li class="contact-group"> | ||
+ | <span class="adr-heading">Contact Us</span> | ||
+ | <span class="adr-info">dcclogin@126.com</span> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </address> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="bottom-footer"> | ||
+ | <div class="container"> | ||
+ | <div class="row"> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </footer><!-- Footer --> | ||
+ | |||
+ | |||
+ | </div><!-- .wrap-body --> | ||
+ | |||
+ | |||
+ | <!-- jQuery and Plugin--> | ||
+ | <script src="js/lightbox-plus-jquery.min.js"></script> | ||
+ | <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> | ||
+ | <!--<script src="js/jquery-3.2.1.min.js"></script>--> | ||
+ | <script src="js/main.js"></script> | ||
+ | <!-- Bootstrap JS --> | ||
+ | <script src="https://cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> | ||
+ | <!--<script src="js/bootstrap.min.js"></script>--> | ||
+ | <!-- Google Map --> | ||
+ | <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB7V-mAjEzzmP6PCQda8To0ZW_o3UOCVCE&callback=initMap" async defer></script> | ||
+ | <!-- Logo --> | ||
+ | <!--<script src="js/arctext.min.js"></script>--> | ||
+ | <script> | ||
+ | $(document).ready(function() { | ||
+ | $(".line-2").arctext({radius: 400}); | ||
+ | }); | ||
+ | </script> | ||
+ | |||
+ | </body> | ||
</html> | </html> |
Latest revision as of 01:57, 2 November 2017
Attributions
First of all, we want to acknowledge all team members’ effort during the one-year preparation. Four groups work hard and tightly so that we can achieve a satisfying outcome. Here present the team group functions, their members’ work division and their achievements.
Program Group
Human Practice Group
Keep positively contact with other iGEM teams, reach collaborations with different organizations, like other universities, and biology companies.
Copy Writer Practice Group
In charge of the documents writing of the wiki pages, posters, and the Giant Jamboree presentation, and also keep records of the team group meetings and progress.
Design Group
Design the team logo and symbol, and beautify the wiki pages, the poster and the presentation PowerPoint to make them more clear and unstandable.
Next, we received generous support and help within our school in order to ensure the project to go on wheels.
Instructors
College Support
2016 SJTU-Software Team
The last year’s team shared their experience with us, and offered preparation suggestions based on the difficulties they encountered. Especially the former team leader, Shiyu Fan, did much effort in selecting this year’s team member.
2015 SJTU-Software Team
The program they made two years ago was the prototype of our project of this year. The efforts they devoted was really helpful to our improvement.
Besides, we also want to show our gratitude towards other universities’ iGEM teams and biology companies, which are involved in our HP activities and collaborations.
Fujian Agriculture and Forestry University (FAFU)
Organizer of the Conference of China iGEMer Community, inviting us as participants.
National Chiao Tung University (NCTU)
Organizer of the 5th iGEM Asia Conference, inviting us as participants.
University of Science and Technology of China (USTC)
Invited us to test their application and seed some feedbacks to them. They gave us suggestions on filtering biobricks.
Bluepha
Bluepha is a company that devoted to applying synthetic biology technology to industrial biological manufacturing. One of their co-founders, Doc. Haoqian Zhang accepted our interview and discussed the present situation of synthetic biology industry in China based on our iGEM topic.
Yaoyanshe
Yaoyanshe APP is the first platform of pharmaceutical research and development industry and value sharing and trading. The founder of Yaoyanshe gave advice on the future industry development in Biology and helped us to polish the idea of our project.
Novelbio Technology Company
Novelbio technology company is a company mainly focused on biological cloud computing. The founder of Novelbio Technology Company, Jie Zong, analyzed the potential of biology software for us.
It is because of your sincere devote and support that we achieved this all. Thanks again for your efforts!
![](https://static.igem.org/mediawiki/2017/a/a5/SJTU-Software_Attribution_003.jpg)
![](https://static.igem.org/mediawiki/2017/e/e9/SJTU-Software_Attribution_001.jpg)
![](https://static.igem.org/mediawiki/2017/9/97/SJTU-Software_Attribution_002.jpg)