Team:UESTC

{{Team:UESTC/hidden}}
{{Team:UESTC/header}}
<html>
	<head>
		<style type="text/css">
		/*
 * img responsive 
 */
img{
	max-width: 100%;
	height: auto;
}
/*
 * top style
 */
#top{
	position: fixed;
	right:0px;
	bottom: 0px;
	z-index: 6;
}
			/*
 * slideshow style
 */
.container{
	width:61.538%;/* 800/1300 */
	height:auto;
	margin: 0 auto;
}
 #slides {
      display: none;
      padding:5px;
    }

    #slides .slidesjs-navigation {
      margin-top:5px;
    }

    a.slidesjs-next,
    a.slidesjs-previous,
    a.slidesjs-play,
    a.slidesjs-stop {
      background-image: url("https://static.igem.org/mediawiki/2013/f/f9/UESTC_btns-next-prev.png");
      background-repeat: no-repeat;
      display:block;
      width:12px;
      height:18px;
      overflow: hidden;
      text-indent: -9999px;
      float: left;
      margin-right:5px;
    }

    a.slidesjs-next {
      margin-right:10px;
      background-position: -12px 0;
    }

    a:hover.slidesjs-next {
      background-position: -12px -18px;
    }

    a.slidesjs-previous {
      background-position: 0 0;
    }

    a:hover.slidesjs-previous {
      background-position: 0 -18px;
    }

    a.slidesjs-play {
      width:15px;
      background-position: -25px 0;
    }

    a:hover.slidesjs-play {
      background-position: -25px -18px;
    }

    a.slidesjs-stop {
      width:18px;
      background-position: -41px 0;
    }

    a:hover.slidesjs-stop {
      background-position: -41px -18px;
    }

    .slidesjs-pagination {
      margin: 7px 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-image: url("https://static.igem.org/mediawiki/2013/0/0f/UESTC_pagination.png");
      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
    }
    /*
 * content style
 */
#hello{
	position:relative;
	width:59%;
	padding:20px;
	height: auto;
	font: bold 0.9em Arial;
	left: 21%;
}
    /*
     * main info style
     */
	.article{
		position:relative;
		padding:0px;
		margin:5px;
		width: 58%;
		left: 20%;
		height: auto;
	}
	.article .a:visited{
		font: 0.5em Arial;
		color: white;
	}
	.see_more{
		display:block;
		text-decoration: none;
		background-color:#b01c20;
		border-radius:3px;
		padding: 1%;
		float: left;
		bottom: 0px;
		background: -moz-linear-gradient(top, rgb(241,92,96) 0%, rgb(176,28,32) 100%);
		background: -webkit-linear-gradient(top, rgb(241,92,96) 0%,rgb(176,28,32) 100%);
		box-shadow: 5px 5px 5px hsla(0, 0%, 26.6667%, 0.8);
		text-shadow: 0px 1px black;
		border: 1px solid #bfbfbf;
		-webkit-transition-property: border, color, text-shadow;
		-webkit-transition-duration: 2s, 3s, 8s; 
	}
	.see_more:hover{
		border: 1px solid black;
		color: black;
		text-shadow: 0px 1px white;
		text-decoration:none;
		background: -webkit-linear-gradient(top, rgb(145,62,56) 0%,rgb(176,28,32) 100%);	
	}
    .proj_info{
		font: 0.8em Arial;
		position: relative;
		float: right;
		width: 80%;
		top: 0px;
	}
	.proj_info a{
		font: bold 1.5em Arial;
		color:black;
		text-shadow: 0 2px 0 hsla(0,0%,100%,0.75);
	}
	.proj_info a:hover{
		text-decoration: none;
		-webkit-animation: warning 1.5s infinite ease-in;
	}
	.proj_logo{
		position:relative;
		float:left;
		width:10%;
		height: auto;
		top: 0px;
		left: 0%;
	}
	#project1{
		height: 200px;
		padding:10px;
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iNDAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjAuODMiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgPC9yYWRpYWxHcmFkaWVudD4KICA8cmVjdCB4PSItNTAiIHk9Ii01MCIgd2lkdGg9IjEwMSIgaGVpZ2h0PSIxMDEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 40%, rgba(255,255,255,0.83) 50%, rgba(255,255,255,0) 100%); /* FF3.6+ */
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(40%,rgba(255,255,255,1)), color-stop(50%,rgba(255,255,255,0.83)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 40%,rgba(255,255,255,0.83) 50%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
background: -o-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 40%,rgba(255,255,255,0.83) 50%,rgba(255,255,255,0) 100%); /* Opera 12+ */
background: -ms-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 40%,rgba(255,255,255,0.83) 50%,rgba(255,255,255,0) 100%); /* IE10+ */
background: radial-gradient(ellipse at center,  rgba(255,255,255,1) 40%,rgba(255,255,255,0.83) 50%,rgba(255,255,255,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */

	}
	#project2{
		height:200px;
		padding: 10px;
		box-shadow: 0px 3px 5px #444444;
		-webkit-box-shadow: 0px 3px 5px #444444;
		-moz-box-shadow:0px 3px 5px #444444;
	}
	#project3{
		height: 200px;
		padding: 10px;
		/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iOTIlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjAiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(-45deg,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 92%, rgba(255,255,255,0) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(92%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(-45deg,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 92%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(-45deg,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 92%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(-45deg,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 92%,rgba(255,255,255,0) 100%); /* IE10+ */
background: linear-gradient(135deg,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 92%,rgba(255,255,255,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */

	}
		/*
 * main content div style
 */
#main{
	box-shadow: inset 0 0 10px #000000;
	-moz-box-shadow:inset 0 0 40px #000000;
	-webkit-box-shadow: inset 0 0 40px #000000;
	padding-bottom: 50px;
	z-index: 10;
	width: 100%;
	height:auto;
	position:relative;
	top: 0px;
	left:0%;
}
@media screen and (max-width: 768px) {
	#main{
		top: 180px;
		height: auto;
	}
}/*
  * CSS3 animation
  */
@-webkit-keyframes warning {
	from {
		text-shadow: 0px 0px 4px #000000;
	}
	50% {
		text-shadow: 0 0 40px #000000;
	}
	to {
		text-shadow: 0 0 4px #000000;
	}
}

		</style>
<!--[if gte IE 9]>
  <style type="text/css">
    .gradient {
       filter: none;
    }
  </style>
<![endif]-->
	</head>
	<body>
		<div id="main">
			<div class="container">
    			<div id="slides">
     			<img src="https://static.igem.org/mediawiki/2013/1/14/Uestc_blueprint.jpg" />
       			<img src="https://static.igem.org/mediawiki/2013/b/bb/Uestc_transpeeder.jpg" />                         
      			<img src="https://static.igem.org/mediawiki/2013/5/5f/Uestc_ibricks.jpg" />        
      			<img src="https://static.igem.org/mediawiki/2013/1/11/Uestc_team.jpg" />
    			</div>
  		    </div><!--end of container-->
			<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
	<script src="https://2013.igem.org/Team:UESTC/js/jquery.slides.min.js?action=raw&ctype=text/javascript"></script>
    <script type="text/javascript">
    	$(function() {
      $('#slides').slidesjs({
        width: 800,
        height: 450,
        play: {
          active: true,
          auto: true,
          interval: 4000,
          swap: true
        }
      });
    });
    </script>
    		<div id="hello">
    			<p>Hi there, We are 2013 iGEM Competition  Software Team UESTC(University of Eelctronic Science and Technology of China). Our team is composed of 3 instructors, 2 advisors, 8 student members from different schools. We have accomplished several projects including...
</p>
    		</div>
    		<div id="project1" class="article">
    			<div class="proj_logo"><img src="https://static.igem.org/mediawiki/2013/4/4c/Uestc_logo_blueprint.png" /></div>
    			<div class="proj_info">
    				<a href="https://2013.igem.org/Team:UESTC/project.html#project1">Blueprint</a>
    				<p>No matter who you are, a scientist proficient in synthetic biology or a greenhand who only cares about output, Blueprint is your best choice. Two major parts are provided: Interactive part & Automatic part. In the first part, you are free to get what you want linking any parts we provide. But you have to make sense, of course. In the second part, the only thing you need to do is to determine the inducer and the output. Then, you can sit back and wait for our software to provide you with the optimized circuit. Wow!</p>
    			</div>
    			<a class="see_more" href="#">More</a>	
    		</div>
    		<div id="project2" class="article">
    			<div class="proj_logo"><img src="https://static.igem.org/mediawiki/2013/8/8f/Uestc_logo_transpeeder.jpg" /></div>
    			<div class="proj_info">
    				<a href="https://2013.igem.org/Team:UESTC/project.html#project2">Transpeeder</a>
    				<p>The satisfying amino acid or nucleic acid sequences that the user submitted will be compared to the chosen CD sequences by ClustalW, the sequence which has highest similarity with SD sequences are defined as the slow-translating sequence, on the contrary, the one which has lowest similarity with SD sequences are defined as the fast-translating sequence.</p>
    			</div>
    			<a class="see_more" href="#">More</a>	
    		</div>
    		<div id="project3" class="article">
    			<div class="proj_logo"><img src="https://static.igem.org/mediawiki/2013/e/e9/Uestc_logo_iBiobricks.jpg" /></div>
    			<div class="proj_info">
    				<a href="https://2013.igem.org/Team:UESTC/project.html#project3">iBricks</a>
    				<p>  iBricks is an iphone game concerning synthetic biology. 
  In this game, what you need to do is to synthesize protein to compound a cell.
  You are provided with several basic parts to synthesize protein. 
  Once you accomplish combining these parts into a circuit, you will enter into transcription process, during which phage will continuously attack your circuit. 
  To protect it, you can press on these phages to kill them. 
  You can also utilize several tools to eliminate phages with higher efficiency.
  After successfully synthesizing the protein, you can get new parts that increase the possibility of successfully synthesizing proteins. 
  With several synthesized proteins, you can accomplish the goal of synthesizing a complete cell.</p>
    			</div>
    			<a class="see_more" href="#">More</a>	
    		</div>
    		<div id="top">
				<a href="#"><img src="https://static.igem.org/mediawiki/2013/c/c3/UESTC_top.png" /></a>
			</div>
		</div>
    <!--end of #main-->
    </body>
</html>
{{Team:UESTC/footer}}