Difference between revisions of "Team:Worldshaper-XSHS"

Line 1: Line 1:
−
<!doctype html>
+
<html>
−
<html lang="en-US">
+
−
<head>
+
−
<meta charset="utf-8">
+
−
<meta http-equiv="X-UA-Compatible" content="IE=edge">
+
−
<meta name="viewport" content="width=device-width, initial-scale=1">
+
−
<title>WorldshaperXSHS</title>
+
−
<link href="css/WorldshaperXHSHsinglePageTemplate.css" rel="stylesheet" type="text/css">
+
−
<!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.-->
+
−
<script>var __adobewebfontsappname__="dreamweaver"</script>
+
−
<script src="http://use.edgefonts.net/source-sans-pro:n2:default.js" type="text/javascript"></script>
+
−
<!-- HTML5 shim and Respond.js for 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="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+
−
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+
−
    <![endif]-->
+
−
</head>
+
−
<body>
+
−
<!-- Main Container -->
+
−
<style>a {
+
−
text-decoration: none
+
−
}
+
−
body {
+
−
font-family: source-sans-pro;
+
−
background-color: #f2f2f2;
+
−
margin-top: 0px;
+
−
margin-right: 0px;
+
−
margin-bottom: 0px;
+
−
margin-left: 0px;
+
−
font-style: normal;
+
−
font-weight: 200;
+
−
}
+
−
/* Container */
+
−
.container {
+
−
width: 90%;
+
−
margin-left: auto;
+
−
margin-right: auto;
+
−
height: 1000px;
+
−
background-color: #FFB100;
+
−
}
+
−
/* Navigation */
+
−
header {
+
−
width: 100%;
+
−
height: 5%;
+
−
background-color: #FFB100;
+
−
+
−
}
+
−
.logo {
+
−
color: #fff;
+
−
font-weight: bold;
+
−
text-align: undefined;
+
−
width: 10%;
+
−
float: left;
+
−
margin-top: 15px;
+
−
margin-left: 25px;
+
−
letter-spacing: 4px;
+
−
}
+
−
nav {
+
−
float: right;
+
−
width: 50%;
+
−
text-align: right;
+
−
margin-right: 25px;
+
−
}
+
−
header nav ul {
+
−
list-style: none;
+
−
float: right;
+
−
}
+
−
nav ul li {
+
−
float: left;
+
−
color: #FFFFFF;
+
−
font-size: 14px;
+
−
text-align: left;
+
−
margin-right: 25px;
+
−
letter-spacing: 2px;
+
−
font-weight: bold;
+
−
transition: all 0.3s linear;
+
−
}
+
−
ul li a {
+
−
color: #FFFFFF;
+
−
text-decoration: none;
+
−
}
+
−
ul li:hover a {
+
−
color: #2C9AB7;
+
−
}
+
−
.hero_header {
+
−
color: #FFFFFF;
+
−
text-align: center;
+
−
margin-top: 0px;
+
−
margin-right: 0px;
+
−
margin-bottom: 0px;
+
−
margin-left: 0px;
+
−
letter-spacing: 4px;
+
−
}
+
−
/* Hero Section */
+
−
.hero {
+
−
background-color: #00C5FF;
+
−
padding-top: 150px;
+
−
padding-bottom: 150px;
+
  
−
}
+
<link rel='stylesheet' type='text/css' href='http://ihyit1011.w1w7.tumm.top/ASTWS/css/wiki_edit.css' />
−
.hero1 {
+
<!-- Bootstrap core CSS -->
−
background-color: #00C5FF;
+
<link href="http://ihyit1011.w1w7.tumm.top/ASTWS/css/bootstrap.min.css" rel="stylesheet">
−
padding-top: 150px;
+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
−
padding-bottom: 150px;
+
<!-- Custom styles for this template -->
−
    height: 1000px;
+
<link href="http://ihyit1011.w1w7.tumm.top/ASTWS/css/owl.carousel.css" rel="stylesheet">
 +
<link href="http://ihyit1011.w1w7.tumm.top/ASTWS/css/owl.theme.default.min.css"  rel="stylesheet">
 +
<link href="http://ihyit1011.w1w7.tumm.top/ASTWS/css/style.css" rel="stylesheet">
 +
<!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
 +
<!--[if lt IE 9]>
 +
<script src="../../assets/js/ie8-responsive-file-warning.js"></script>
 +
<![endif]-->
 +
<script src="js/ie-emulation-modes-warning.js"></script>
 +
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
 +
<!--[if lt IE 9]>
 +
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
 +
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
 +
<![endif]-->
  
−
}
+
<!-- Navigation -->
−
.cover {
+
<nav class="navbar navbar-default navbar-fixed-top">
−
background-color: #CFCFCF;
+
<div class="container">
−
padding-top: 150px;
+
<!-- Brand and toggle get grouped for better mobile display -->
−
padding-bottom: 150px;
+
<div class="navbar-header page-scroll">
−
}
+
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
−
.light {
+
<span class="sr-only">Toggle navigation</span>
−
font-weight: bold;
+
<span class="icon-bar"></span>
−
color: #717070;
+
<span class="icon-bar"></span>
−
}
+
<span class="icon-bar"></span>
−
.tagline {
+
</button>
−
text-align: center;
+
<a class="navbar-brand page-scroll" href="#page-top">
−
color: #FFFFFF;
+
<img src="https://igem.org/wiki/skins/Igem/images/Igemlogo_banner.jpg" height=50px alt="logo"></a>
−
margin-top: 4px;
+
</div>
−
font-weight: lighter;
+
<!-- Collect the nav links, forms, and other content for toggling -->
−
text-transform: uppercase;
+
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
−
letter-spacing: 1px;
+
<ul class="nav navbar-nav navbar-right">
−
font-size: 50px;
+
<li class="hidden">
−
}
+
<a href="#page-top"></a>
−
.HUANGNAN {
+
</li>
−
text-align: center;
+
<li>
−
color: #000000;
+
<a class="page-scroll" href="#about">About</a>
−
margin-top: 4px;
+
</li>
−
font-weight: lighter;
+
<li>
−
text-transform: uppercase;
+
<a class="page-scroll" href="#services">Services</a>
−
letter-spacing: 1px;
+
</li>
−
font-size: 50px;
+
<li>
−
}
+
<a class="page-scroll" href="#portfolio">Portfolio</a>
−
.emmm {
+
</li>
−
background-color: #FFB100;
+
<li>
−
padding-top: 150px;
+
<a class="page-scroll" href="#team">Team</a>
−
padding-bottom: 150px;
+
</li>
−
}
+
<li>
−
/* About Section */
+
<a class="page-scroll" href="#contact">Contact</a>
−
.about {
+
</li>
−
background-color: #ffffFF;
+
</ul>
−
padding-top: 150px;
+
</div>
−
padding-bottom: 150px;
+
<!-- /.navbar-collapse -->
−
}
+
</div>
−
.light {
+
<!-- /.container-fluid -->
−
font-weight: bold;
+
</nav>
−
color: #717070;
+
<!-- Header -->
−
}
+
<header>
−
.tagline {
+
<div class="container">
−
text-align: center;
+
<div class="slider-container">
−
color: #FFFFFF;
+
<div class="intro-text">
−
margin-top: 4px;
+
<div class="intro-lead-in">Welcome To Our Studio!</div>
−
font-weight: lighter;
+
<div class="intro-heading">It's Nice To Meet You</div>
−
text-transform: uppercase;
+
<a href="#about" class="page-scroll btn btn-xl">Tell Me More</a>
−
letter-spacing: 1px;
+
</div>
−
}
+
</div>
−
/* Stats Gallery */
+
</div>
−
.stats {
+
</header>
−
color: #717070;
+
−
margin-bottom: 5px;
+
−
}
+
−
.gallery {
+
−
clear: both;
+
−
display: inline-block;
+
−
width: 100%;
+
−
background-color: #FFFFFF;
+
−
/* [disabled]min-width: 400px;
+
−
*/
+
−
padding-bottom: 35px;
+
−
padding-top: 0px;
+
−
margin-top: -5px;
+
−
margin-bottom: 0px;
+
−
}
+
−
.thumbnail {
+
−
width: 25%;
+
−
text-align: center;
+
−
float: left;
+
−
margin-top: 35px;
+
−
}
+
−
.gallery .thumbnail h4 {
+
−
margin-top: 5px;
+
−
margin-right: 5px;
+
−
margin-bottom: 5px;
+
−
margin-left: 5px;
+
−
color: #52BAD5;
+
−
}
+
−
.gallery .thumbnail p {
+
−
margin-top: 0px;
+
−
margin-right: 0px;
+
−
margin-bottom: 0px;
+
−
margin-left: 0px;
+
−
color: #A3A3A3;
+
−
}
+
−
/* Parallax Section */
+
−
.banner {
+
−
background-color: #2D9AB7;
+
−
background-image: url(../images/parallax.png);
+
−
height: 400px;
+
−
background-attachment: fixed;
+
−
background-size: cover;
+
−
background-repeat: no-repeat;
+
−
}
+
−
.parallax {
+
−
color: #FFFFFF;
+
−
text-align: right;
+
−
padding-right: 100px;
+
−
padding-top: 110px;
+
−
letter-spacing: 2px;
+
−
margin-top: 0px;
+
−
}
+
−
.parallax_description {
+
−
color: #FFFFFF;
+
−
text-align: right;
+
−
padding-right: 100px;
+
−
width: 30%;
+
−
float: right;
+
−
font-weight: lighter;
+
−
line-height: 23px;
+
−
margin-top: 0px;
+
−
margin-right: 0px;
+
−
margin-bottom: 0px;
+
−
margin-left: 0px;
+
−
}
+
−
/* More info */
+
−
footer {
+
−
background-color: #FFFFFF;
+
−
padding-bottom: 35px;
+
−
}
+
−
.footer_column {
+
−
width: 50%;
+
−
text-align: center;
+
−
padding-top: 30px;
+
−
float: left;
+
−
}
+
−
footer .footer_column h3 {
+
−
color: #B3B3B3;
+
−
text-align: center;
+
−
}
+
−
footer .footer_column p {
+
−
color: #717070;
+
−
background-color: #FFFFFF;
+
−
}
+
−
.cards {
+
−
width: 100%;
+
−
height: auto;
+
−
max-width: 400px;
+
−
max-height: 200px;
+
−
}
+
−
.cute {
+
−
width: 100%;
+
−
height: auto;
+
−
max-width: 1920px;
+
−
max-height: 1080px;
+
−
}
+
−
footer .footer_column p {
+
−
padding-left: 30px;
+
−
padding-right: 30px;
+
−
text-align: justify;
+
−
line-height: 25px;
+
−
font-weight: lighter;
+
−
margin-left: 20px;
+
−
margin-right: 20px;
+
−
}
+
−
.button {
+
−
width: 200px;
+
−
margin-top: 40px;
+
−
margin-right: auto;
+
−
margin-bottom: auto;
+
−
margin-left: auto;
+
−
padding-top: 20px;
+
−
padding-right: 10px;
+
−
padding-bottom: 20px;
+
−
padding-left: 10px;
+
−
text-align: center;
+
−
vertical-align: middle;
+
−
border-radius: 0px;
+
−
text-transform: uppercase;
+
−
font-weight: bold;
+
−
letter-spacing: 2px;
+
−
border: 3px solid #FFFFFF;
+
−
color: #FFFFFF;
+
−
transition: all 0.3s linear;
+
−
}
+
−
.button:hover {
+
−
background-color: #FEFEFE;
+
−
color: #C4C4C4;
+
−
cursor: pointer;
+
−
}
+
−
.copyright {
+
−
text-align: center;
+
−
padding-top: 20px;
+
−
padding-bottom: 20px;
+
−
background-color: #FFB100;
+
−
color: #FFFFFF;
+
−
text-transform: uppercase;
+
−
font-weight: lighter;
+
−
letter-spacing: 2px;
+
−
border-top-width: 2px;
+
−
}
+
−
.footer_banner {
+
−
background-color: #B3B3B3;
+
−
padding-top: 60px;
+
−
padding-bottom: 60PX;
+
−
margin-bottom: 0px;
+
−
background-image: url(../images/pattern.png);
+
−
background-repeat: repeat;
+
−
}
+
−
footer {
+
−
display: inline-block;
+
−
}
+
−
.hidden {
+
−
display: none;
+
−
}
+
  
−
/* Mobile */
+
<section id="about" class="light-bg">
−
@media (max-width: 320px) {
+
<div class="container">
−
.logo {
+
<div class="row">
−
width: 100%;
+
<div class="col-lg-12 text-center">
−
text-align: center;
+
<div class="section-title">
−
margin-top: 13px;
+
<h2>ABOUT</h2>
−
margin-right: 0px;
+
<p>
−
margin-bottom: 0px;
+
A creative agency based on Candy Land, ready to boost your business with some beautifull templates. Lattes Agency is one of the best in town see more you will be amazed.
−
margin-left: 0px;
+
</p>
−
}
+
</div>
−
.container header nav {
+
</div>
−
margin-top: 0px;
+
</div>
−
margin-right: 0px;
+
<div class="row">
−
margin-bottom: 0px;
+
<!-- about module -->
−
margin-left: 0px;
+
<div class="col-md-3 text-center">
−
width: 100%;
+
<div class="mz-module-about"> <i class="fa fa-briefcase ot-circle"></i>
−
float: none;
+
<h3>Web Development</h3>
−
display: none;
+
<p>
−
}
+
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis
−
header nav ul {
+
</p>
−
}
+
</div>
−
nav ul li {
+
</div>
−
margin-top: 0px;
+
<!-- end about module -->
−
margin-right: 0px;
+
<!-- about module -->
−
margin-bottom: 0px;
+
<div class="col-md-3 text-center">
−
margin-left: 0px;
+
<div class="mz-module-about"> <i class="fa fa-photo ot-circle"></i>
−
width: 100%;
+
<h3>Visualisation</h3>
−
text-align: center;
+
<p>
−
}
+
Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe
−
.text_column {
+
</p>
−
width: 100%;
+
</div>
−
text-align: justify;
+
</div>
−
padding-top: 0px;
+
<!-- end about module -->
−
padding-right: 0px;
+
<!-- about module -->
−
padding-bottom: 0px;
+
<div class="col-md-3 text-center">
−
padding-left: 0px;
+
<div class="mz-module-about">
−
}
+
<i class="fa fa-camera-retro ot-circle"></i>
−
.thumbnail {
+
<h3>Photography</h3>
−
width: 100%;
+
<p>Accusamus et iusto odio dignissimos ducimus qui blanditiis</p>
−
}
+
</div>
−
.footer_column {
+
</div>
−
width: 100%;
+
<!-- end about module -->
−
margin-top: 0px;
+
<!-- about module -->
−
}
+
<div class="col-md-3 text-center">
−
.parallax {
+
<div class="mz-module-about">
−
text-align: center;
+
<i class="fa fa-cube ot-circle"></i>
−
margin-top: 0px;
+
<h3>UI/UX Design</h3>
−
margin-right: 0px;
+
<p>
−
margin-bottom: 0px;
+
Itaque earum rerum hic tenetur a sapiente, ut aut reiciendis maiores
−
margin-left: 0px;
+
</p>
−
padding-top: 40%;
+
</div>
−
padding-right: 0px;
+
</div>
−
padding-bottom: 0px;
+
<!-- end about module -->
−
padding-left: 0px;
+
</div>
−
width: 100%;
+
</div>
−
font-size: 18px;
+
<!-- /.container -->
−
}
+
</section>
−
.parallax_description {
+
−
padding-top: 0px;
+
−
padding-right: 0px;
+
−
padding-bottom: 0px;
+
−
padding-left: 0px;
+
−
width: 90%;
+
−
margin-top: 25px;
+
−
margin-right: 0px;
+
−
margin-bottom: 0px;
+
−
margin-left: 12px;
+
−
float: none;
+
−
text-align: center;
+
−
}
+
−
.banner {
+
−
background-color: #2D9AB7;
+
−
background-image: none;
+
−
}
+
−
.tagline {
+
−
margin-top: 20px;
+
−
line-height: 22px;
+
−
}
+
−
.hero_header {
+
−
padding-left: 10px;
+
−
padding-right: 10px;
+
−
line-height: 22px;
+
−
text-align: center;
+
−
}
+
−
}
+
  
−
/* Small Tablets */
+
<section>
−
@media (min-width: 321px)and (max-width: 767px) {
+
<div class="container">
−
.logo {
+
<div class="row">
−
width: 100%;
+
<div class="col-lg-12 text-center">
−
text-align: center;
+
<div class="section-title">
−
margin-top: 13px;
+
<h2>Our Partners</h2>
−
margin-right: 0px;
+
<p>Mida sit una namet, cons uectetur adipiscing adon elit.</p>
−
margin-bottom: 0px;
+
</div>
−
margin-left: 0px;
+
</div>
−
color: #043745;
+
</div>
−
}
+
<div class="row">
−
.container header nav {
+
<div class="col-lg-12 text-center">
−
margin-top: 0px;
+
<div class="owl-carousel">
−
margin-right: 0px;
+
<div class="item">
−
margin-bottom: 0px;
+
<div class="partner-logo">
−
margin-left: 0px;
+
<img src="https://static.igem.org/mediawiki/2017/f/fa/T-ASTWS-China-img-2.png" alt="partners"></div>
−
width: 100%;
+
</div>
−
float: none;
+
<div class="item">
−
overflow: auto;
+
<div class="partner-logo">
−
display: inline-block;
+
<img src="https://static.igem.org/mediawiki/2017/f/fa/T-ASTWS-China-img-2.png" alt="partners"></div>
−
background: #52bad5;
+
</div>
−
}
+
<div class="item">
−
header nav ul {
+
<div class="partner-logo">
−
padding: 0px;
+
<img src="https://static.igem.org/mediawiki/2017/f/fa/T-ASTWS-China-img-2.png" alt="partners"></div>
−
float: none;
+
</div>
−
}
+
<div class="item">
−
nav ul li {
+
<div class="partner-logo">
−
margin-top: 0px;
+
<img src="https://static.igem.org/mediawiki/2017/f/fa/T-ASTWS-China-img-2.png" alt="partners"></div>
−
margin-right: 0px;
+
</div>
−
margin-bottom: 0px;
+
<div class="item">
−
margin-left: 0px;
+
<div class="partner-logo">
−
width: 100%;
+
<img src="https://static.igem.org/mediawiki/2017/f/fa/T-ASTWS-China-img-2.png" alt="partners"></div>
−
text-align: center;
+
</div>
−
padding-top: 8px;
+
<div class="item">
−
padding-bottom: 8px;
+
<div class="partner-logo">
−
}
+
<img src="https://static.igem.org/mediawiki/2017/f/fa/T-ASTWS-China-img-2.png" alt="partners"></div>
−
.text_column {
+
</div>
−
width: 100%;
+
<div class="item">
−
text-align: left;
+
<div class="partner-logo">
−
padding-top: 0px;
+
<img src="https://static.igem.org/mediawiki/2017/f/fa/T-ASTWS-China-img-2.png" alt="partners"></div>
−
padding-right: 0px;
+
</div>
−
padding-bottom: 0px;
+
</div>
−
padding-left: 0px;
+
</div>
−
}
+
</div>
−
.thumbnail {
+
</div>
−
width: 100%;
+
</section>
−
}
+
 
−
.footer_column {
+
<section id="portfolio" class="light-bg">
−
width: 100%;
+
<div class="container">
−
margin-top: 0px;
+
<div class="row">
−
}
+
<div class="col-lg-12 text-center">
−
.parallax {
+
<div class="section-title">
−
text-align: center;
+
<h2>Portfolio</h2>
−
margin-top: 0px;
+
<p>
−
margin-right: 0px;
+
Our portfolio is the best way to show our work, you can see here a big range of our work. Check them all and you will find what you are looking for.
−
margin-bottom: 0px;
+
</p>
−
margin-left: 0px;
+
</div>
−
padding-top: 40%;
+
</div>
−
padding-right: 0px;
+
</div>
−
padding-bottom: 0px;
+
<div class="row">
−
padding-left: 0px;
+
<!-- start portfolio item -->
−
width: 100%;
+
<div class="col-md-4">
−
font-size: 18px;
+
<div class="ot-portfolio-item">
−
}
+
<figure class="effect-bubba">
−
.parallax_description {
+
<img src="https://static.igem.org/mediawiki/2017/0/00/T-ASTWS-China--portfolio-1.jpeg" alt="img02" class="img-responsive" />
−
padding-top: 0px;
+
<figcaption>
−
padding-right: 0px;
+
<h2>Dean & Letter</h2>
−
padding-bottom: 0px;
+
<p>Branding, Design</p>
−
padding-left: 0px;
+
<a href="#" data-toggle="modal" data-target="#Modal-1">View more</a>
−
margin-top: 30%;
+
</figcaption>
−
margin-right: 0px;
+
</figure>
−
margin-bottom: 0px;
+
</div>
−
margin-left: 0px;
+
</div>
−
float: none;
+
<!-- end portfolio item -->
−
width: 100%;
+
<!-- start portfolio item -->
−
text-align: center;
+
<div class="col-md-4">
−
}
+
<div class="ot-portfolio-item">
−
.thumbnail {
+
<figure class="effect-bubba">
−
width: 50%;
+
<img src="https://static.igem.org/mediawiki/2017/0/00/T-ASTWS-China--portfolio-1.jpeg" alt="img02" class="img-responsive" />
−
}
+
<figcaption>
−
.parallax {
+
<h2>Startup Framework</h2>
−
margin-top: 0px;
+
<p>Branding, Web Design</p>
−
margin-right: 0px;
+
<a href="#" data-toggle="modal" data-target="#Modal-2">View more</a>
−
margin-bottom: 0px;
+
</figcaption>
−
margin-left: 0px;
+
</figure>
−
padding-right: 0px;
+
</div>
−
padding-bottom: 0px;
+
</div>
−
padding-left: 0px;
+
<!-- end portfolio item -->
−
padding-top: 20%;
+
<!-- start portfolio item -->
−
}
+
<div class="col-md-4">
−
.parallax_description {
+
<div class="ot-portfolio-item">
−
margin-top: 0px;
+
<figure class="effect-bubba">
−
margin-right: 0px;
+
<img src="https://static.igem.org/mediawiki/2017/0/00/T-ASTWS-China--portfolio-1.jpeg" alt="img02" class="img-responsive" />
−
margin-bottom: 0px;
+
<figcaption>
−
margin-left: 0px;
+
<h2>Lamp & Velvet</h2>
−
width: 100%;
+
<p>Branding, Web Design</p>
−
padding-top: 30px;
+
<a href="#" data-toggle="modal" data-target="#Modal-3">View more</a>
−
}
+
</figcaption>
−
.banner {
+
</figure>
−
padding-left: 20px;
+
</div>
−
padding-right: 20px;
+
</div>
−
}
+
<!-- end portfolio item -->
−
.footer_column {
+
</div>
−
width: 100%;
+
<div class="row">
−
}
+
<!-- start portfolio item -->
−
}
+
<div class="col-md-4">
 +
<div class="ot-portfolio-item">
 +
<figure class="effect-bubba">
 +
<img src="https://static.igem.org/mediawiki/2017/0/00/T-ASTWS-China--portfolio-1.jpeg" alt="img02" class="img-responsive" />
 +
<figcaption>
 +
<h2>Smart Name</h2>
 +
<p>Branding, Design</p>
 +
<a href="#" data-toggle="modal" data-target="#Modal-4">View more</a>
 +
</figcaption>
 +
</figure>
 +
</div>
 +
</div>
 +
<!-- end portfolio item -->
 +
<!-- start portfolio item -->
 +
<div class="col-md-4">
 +
<div class="ot-portfolio-item">
 +
<figure class="effect-bubba">
 +
<img src="https://static.igem.org/mediawiki/2017/0/00/T-ASTWS-China--portfolio-1.jpeg" alt="img02" class="img-responsive" />
 +
<figcaption>
 +
<h2>Fast People</h2>
 +
<p>Branding, Web Design</p>
 +
<a href="#" data-toggle="modal" data-target="#Modal-5">View more</a>
 +
</figcaption>
 +
</figure>
 +
</div>
 +
</div>
 +
<!-- end portfolio item -->
 +
<!-- start portfolio item -->
 +
<div class="col-md-4">
 +
<div class="ot-portfolio-item">
 +
<figure class="effect-bubba">
 +
<img src="https://static.igem.org/mediawiki/2017/0/00/T-ASTWS-China--portfolio-1.jpeg" alt="img02" class="img-responsive" />
 +
<figcaption>
 +
<h2>Kites & Stars</h2>
 +
<p>Branding, Web Design</p>
 +
<a href="#" data-toggle="modal" data-target="#Modal-2">View more</a>
 +
</figcaption>
 +
</figure>
 +
</div>
 +
</div>
 +
<!-- end portfolio item -->
 +
</div>
 +
</div>
 +
<!-- end container -->
 +
</section>
 +
 
 +
<p id="back-top">
 +
<a href="#top">
 +
<i class="fa fa-angle-up"></i>
 +
</a>
 +
</p>
 +
 
 +
<footer>
 +
<div class="container text-center">
 +
<p>Copyright &copy; 2017 Team:ASTWS-China All Rights Reserved.</p>
 +
</div>
 +
</footer>
 +
 
 +
<!-- Placed at the end of the document so the pages load faster -->
 +
<script src="http://ihyit1011.w1w7.tumm.top/ASTWS/js/jquery.min.js"></script>
 +
<script src="http://ihyit1011.w1w7.tumm.top/ASTWS/js/jquery.easing.min.js"></script>
 +
<script src="http://ihyit1011.w1w7.tumm.top/ASTWS/js/bootstrap.min.js"></script>
 +
<script src="http://ihyit1011.w1w7.tumm.top/ASTWS/js/owl.carousel.min.js"></script>
 +
<script src="http://ihyit1011.w1w7.tumm.top/ASTWS/js/cbpAnimatedHeader.js"></script>
 +
<script src="http://ihyit1011.w1w7.tumm.top/ASTWS/js/theme-scripts.js"></script>
 +
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
 +
<script src="http://ihyit1011.w1w7.tumm.top/ASTWS/js/ie10-viewport-bug-workaround.js"></script>
  
−
/* Small Desktops */
 
−
@media (min-width: 768px) and (max-width: 1096px) {
 
−
.text_column {
 
−
width: 100%;
 
−
}
 
−
.thumbnail {
 
−
width: 50%;
 
−
}
 
−
.text_column {
 
−
width: 100%;
 
−
margin-top: 0px;
 
−
margin-right: 0px;
 
−
margin-bottom: 0px;
 
−
margin-left: 0px;
 
−
padding-top: 0px;
 
−
padding-right: 0px;
 
−
padding-bottom: 0px;
 
−
padding-left: 0px;
 
−
}
 
−
.banner {
 
−
margin-top: 0px;
 
−
padding-top: 0px;
 
−
}
 
−
}
 
−
</style>
 
−
<div class="container">
 
−
  <!-- Navigation -->
 
−
  <header> <a href="">
 
−
        <h4 class="logo">WorldshaperXSHS</h4>
 
−
    </a>
 
−
    <nav>
 
−
      <ul>
 
−
        <li><a href="Untitled-2.html">HOME</a></li>
 
−
        <li><a href="2.html">TEAM</a></li>
 
−
        <li> <a href="#contact">PROJECT</a></li>
 
−
        <li> <a href="#contact">PARTS</a></li>
 
−
        <li> <a href="#contact">SAFETY</a></li>
 
−
        <li> <a href="#contact">HP</a></li>
 
−
        <li> <a href="#contact">AWARDS</a></li>
 
−
      </ul>
 
−
    </nav>
 
−
  </header>
 
−
  <img src="images/worldshaperXSHSfengmian.jpg" alt="" width="1920" height="1080" class="cute"/>
 
−
  <!-- Hero Section -->
 
−
  <section class="hero" id="hero">
 
−
    <h5 class="tagline">E.coli:oxygen is delicious!</h5>
 
−
  </section>
 
−
  <!-- About Section -->
 
−
  <section class="about" id="about">
 
−
  <h5 class="HUANGNAN">BACKGROUND</h5>
 
−
    <h2 class="hidden">About</h2>
 
−
 
 
−
  </section>
 
−
    <a href="2.html">
 
−
    <section class="emmm" id="emmm">
 
−
  <h5 class="HUANGNAN">TEAM</h5>
 
−
    <h2 class="hidden">emmm</h2>
 
−
  </section>
 
−
  </a>
 
−
  <!-- Stats Gallery Section -->
 
−
  <!-- Parallax Section -->
 
−
  <section class="hero" id="hero">
 
−
    <h5 class="tagline">PROJECT</h5>
 
−
  </section>
 
−
  <!-- About Section -->
 
−
  <section class="about" id="about">
 
−
  <h5 class="HUANGNAN">PARTS</h5>
 
−
    <h2 class="hidden">About</h2>
 
−
 
 
−
  </section>
 
−
    <section class="emmm" id="emmm">
 
−
  <h5 class="HUANGNAN">SAFETY</h5>
 
−
    <h2 class="hidden">emmm</h2>
 
−
 
 
−
  </section>
 
−
  <section class="hero" id="hero">
 
−
    <h5 class="tagline">HP</h5>
 
−
  </section>
 
−
  <!-- About Section -->
 
−
  <section class="about" id="about">
 
−
  <h5 class="HUANGNAN">AWARDS</h5>
 
−
    <h2 class="hidden">About</h2>
 
−
  </section>
 
−
  <div class="copyright">&copy;2017 - <strong>IGEM worldshaperxshs</strong></div>
 
−
</div>
 
−
<!-- Main Container Ends -->
 
−
</body>
 
 
</html>
 
</html>

Revision as of 09:18, 15 October 2017

Welcome To Our Studio!
It's Nice To Meet You
Tell Me More

ABOUT

A creative agency based on Candy Land, ready to boost your business with some beautifull templates. Lattes Agency is one of the best in town see more you will be amazed.

Web Development

At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis

Visualisation

Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe

Photography

Accusamus et iusto odio dignissimos ducimus qui blanditiis

UI/UX Design

Itaque earum rerum hic tenetur a sapiente, ut aut reiciendis maiores

Our Partners

Mida sit una namet, cons uectetur adipiscing adon elit.

Portfolio

Our portfolio is the best way to show our work, you can see here a big range of our work. Check them all and you will find what you are looking for.

img02

Dean & Letter

Branding, Design

View more
img02

Startup Framework

Branding, Web Design

View more
img02

Lamp & Velvet

Branding, Web Design

View more
img02

Smart Name

Branding, Design

View more
img02

Fast People

Branding, Web Design

View more
img02

Kites & Stars

Branding, Web Design

View more

Copyright © 2017 Team:ASTWS-China All Rights Reserved.