Difference between revisions of "Team:DUT China B/Team"

Line 1: Line 1:
 
{{DUT_China_B/test_style.css}}
 
{{DUT_China_B/test_style.css}}
<html>
+
<html lang="en" >
+
<head>
<style>
+
  <meta charset="UTF-8">
.carousel-caption {
+
  <title>masonry grid css</title>
position: relative;
+
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
left: auto;
+
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css'>
right: auto;
+
<link rel="stylesheet" href="./style.css">
}
+
<style>.block-grid {
+
  margin-top: 3em;
.carousel-control-next-icon {
+
  -webkit-column-count: 3;
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3E%3Cpath d='M1.5 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
+
          column-count: 3;
}
+
  -webkit-column-gap: 1em;
+
          column-gap: 1em;
.carousel-control-prev-icon {
+
  position: relative;
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
+
}
+
.carousel-caption{
+
color: #000000 !important;
+
 
}
 
}
</style>
 
  
+
.block-panel {
+
  -webkit-column-break-inside: avoid;
<body data-spy="scroll" data-target="#myScrollspy" data-offset="10">
+
          break-inside: avoid;
<div class="container-full">
+
  border-radius: 2px;
<div class="card">
+
  margin: 0 0 1em;
<img class="card-img-top" src="https://static.igem.org/mediawiki/2018/4/4f/T--SZU-China--team.jpg" />
+
  background-color: #69d7f8;
</div>
+
  overflow: hidden;
</div>
+
  position: relative;
 +
  cursor: pointer;
 +
  -webkit-transform: translateX(0);
 +
          transform: translateX(0);
 +
  display: inline-block;
 +
}
 +
.block-panel:hover p {
 +
  -webkit-transform: translateY(0);
 +
          transform: translateY(0);
 +
  opacity: 1;
 +
}
 +
.block-panel:hover h1 {
 +
  bottom: calc(100% - 4em);
 +
}
  
<div class="container-fluid">
+
h1 {
 +
  padding-left: 2rem;
 +
  font-size: 2em;
 +
  font-weight: 800;
 +
  padding-bottom: 2em;
 +
  color: white;
 +
  width: 50%;
 +
  position: absolute;
 +
  text-transform: uppercase;
 +
  bottom: -2em;
 +
  transition: all .3s ease;
 +
  z-index: 3;
 +
}
  
<div class="col-9 offset-1 shadow ">
+
p {
<div class="row"></div>
+
  padding: 8em 2em 2em 2em;
<div class="text-center">
+
  position: relative;
<h1 style="color: #664788;">Team</h1>
+
  color: white;
</div>
+
  z-index: 2;
<div class="indent">
+
  -webkit-transform: translateY(100%);
<h1>Team Members:</h1>
+
          transform: translateY(100%);
</div>
+
  margin: 0;
<div class="row">
+
  opacity: .5;
<div class="col-10 offset-1">
+
  transition: all .35s ease;
<!--Carousel Wrapper-->
+
}
 
+
p::after {
<div id="carousel-example-2" class="carousel slide" data-ride="carousel">
+
  background: #13c1f0;
<!--Indicators-->
+
  bottom: 0;
<ol class="carousel-indicators">
+
  content: '';
<li data-target="#carousel-example-2" data-slide-to="0" class="active"></li>
+
  display: block;
<li data-target="#carousel-example-2" data-slide-to="1"></li>
+
  height: 100%;
<li data-target="#carousel-example-2" data-slide-to="2"></li>
+
  left: 0;
<li data-target="#carousel-example-2" data-slide-to="3"></li>
+
  position: absolute;
<li data-target="#carousel-example-2" data-slide-to="4"></li>
+
  right: 0;
<li data-target="#carousel-example-2" data-slide-to="5"></li>
+
  -webkit-transform: skewY(-7deg);
<li data-target="#carousel-example-2" data-slide-to="6"></li>
+
          transform: skewY(-7deg);
<li data-target="#carousel-example-2" data-slide-to="7"></li>
+
  -webkit-transform-origin: 100%;
<li data-target="#carousel-example-2" data-slide-to="8"></li>
+
          transform-origin: 100%;
<li data-target="#carousel-example-2" data-slide-to="9"></li>
+
  z-index: -1;
<li data-target="#carousel-example-2" data-slide-to="10"></li>
+
  top: 3em;
 
+
}
</ol>
+
</style>
<!--/.Indicators-->
+
</head>
<!--Slides-->
+
<body>
<div class="carousel-inner" role="listbox" style="height: 800px;">
+
<!-- partial:index.partial.html -->
<div class="carousel-item active">
+
<html>
<div class="view text-center">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/6/65/T--SZU-China--Mingyue.jpg" alt="First slide">
+
<div class="mask rgba-black-light"></div>
+
 
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Mingyue Luo</h3>
+
<p style="padding: 40px;">He is an undergraduate from Shenzhen University who majors in bioengineering. He is the leader of our team who is responsible and kind. This year is the second year for him to take part in iGEM competition and he is very proud of this. He always staying up late in our lab because nothing’s gonna change his love for doing experiment.
+
</p>
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/7/7d/T--SZU-China--Chen.jpg" alt="Second slide">
+
<div class="mask rgba-black-strong"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Chen Liang</h3>
+
<p style="padding: 40px;">She is an undergraduate from Shenzhen University, majoring in clinical medicine. She is responsible for experiment and presentation in our team. She is very tough and independent. Nothing can defeat her except for sleep deprivation, but she always stays up during experiment and final month. She believes in rationalism and acts rationally all the time. She dreams of being a great doctor and work for MSF one day.</p>
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/5/52/T--SZU-China--Gefei.jpg" alt="Third slide">
+
<div class="mask rgba-black-slight"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Gefei Li</h3>
+
<p style="padding: 40px;">She is an undergraduate from Shenzhen University who majors in clinical medicine. She is responsible and capable and always pushes the team and herself to try new things. She is usually tough but not in front of the delicious food so if your project this year is about losing weight then you might see her at your poster.</p>
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/b/ba/T--SZU-China--Jianting.jpg" alt="Second slide">
+
<div class="mask rgba-black-strong"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Jianting Huang</h3>
+
<p style="padding: 40px;"> Jianting Huang is an undergraduate from Shenzhen University, major in biotechnology. He is responsible for human practice in SZU-China. He is very social and popular everywhere. He has dual-degree in CS. In a word, he is awesome.
+
</p>
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/7/74/T--SZU-China--Jiaqi.jpg" alt="Second slide">
+
<div class="mask rgba-black-strong"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Jiaqi Tang</h3>
+
<p style="padding: 40px;"> He is an undergraduate student from Shenzhen University who majors in biotechnology. He has extensive experience in designing processes and organizing events, and he is responsible for Human Practice design and execution in this project. He is expert in telling some interesting stories. He enjoys writing short essays to express himself in his spare time.
+
</p>
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/1/16/T--SZU-China--Jingquan.jpg" alt="Second slide">
+
<div class="mask rgba-black-strong"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Jinquan Li</h3>
+
<p style="padding: 40px;">
+
He is an undergraduate from Shenzhen University's Institute of Advanced Study, who majors in biology and physics. He is a creative person and contributes to the dry lab. He is interested in the interdisciplinary nature of synthetic biology.
+
 
+
</p>
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/4/43/T--SZU-China--Junyu.jpg" alt="Second slide">
+
<div class="mask rgba-black-strong"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Junyu Chen</h3>
+
<p style="padding: 40px;"> 本人擅长Ai、Fw、Fl、Br、Ae、Pr、Id、Ps等软件的安装与卸载,精通CSS、JavaScript、PHP、ASP、C、C++、C#、Java、Ruby、Perl、Lisp、python、Objective-C、ActionScript、Pascal、spss、sas等单词的拼写,熟悉Windows、Linux、Mac、Android、IOS、WP8等系统的开关机。
+
</p>
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/9/95/T--SZU-China--Lindong.jpg" alt="Second slide">
+
<div class="mask rgba-black-strong"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Lindong He</h3>
+
<p style="padding: 40px;">
+
He is an undergraduate from Shenzhen University who majors in bioengineering. He is conscientious about the experiment and enthusiastic to help other teammates. But he is an obsessive and always want to tidy up many things in the lab. As for dreams, he just wants to be a big boss in the future.
+
 
+
</p>
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/d/d6/T--SZU-China--Roufeng.jpg" alt="Second slide">
+
<div class="mask rgba-black-strong"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Roufeng Guo</h3>
+
<p style="padding: 40px;">
+
He is a junior in computer science and software engineering at Shenzhen University. He is not very handsome but has a funny soul. He likes to challenge exciting things and experience different living environments. At the same time, he also longs for the regular and temperate life of the army.
+
 
+
</p>
+
 
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/c/c9/T--SZU-China--Xiaohan.jpg" alt="Second slide">
+
<div class="mask rgba-black-strong"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Xiaohan Xie</h3>
+
<p style="padding: 40px;">
+
She is an undergraduate from Shenzhen University. She majors in physics but is responsible for software development in our team. She likes to explore programming and uses it to implement ideas. She loves cats and has two cats of her own, Pido and 66, she often helps stray cats.
+
 
+
</p>
+
</div>
+
</div>
+
 
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/0/09/T--SZU-China--Yongshi.jpg" alt="Second slide">
+
<div class="mask rgba-black-strong"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Yongshi Ye</h3>
+
<p style="padding: 40px;">
+
She is an undergraduate from Shenzhen University who is also the youngest in the team. Within the team, she worked on all kinds of design. Music, drama and animation take an important part of her life which is also the key of her inspiration. Though is a little bit shy and not so talky, she does have a creative mind and enjoy trying new things.
+
 
+
</p>
+
</div>
+
</div>
+
</div>
+
<!--/.Slides-->
+
<!--Controls-->
+
<a class="carousel-control-prev" href="#carousel-example-2" role="button" data-slide="prev">
+
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
+
<span class="sr-only">Previous</span>
+
</a>
+
<a class="carousel-control-next" href="#carousel-example-2" role="button" data-slide="next">
+
<span class="carousel-control-next-icon" aria-hidden="true"></span>
+
<span class="sr-only">Next</span>
+
</a>
+
<!--/.Controls-->
+
</div>
+
<!--/.Carousel Wrapper-->
+
</div>
+
</div>
+
 
+
<div class="row">
+
<div class="col-6">
+
<h1>PI &#38; Advisors:</h1>
+
</div>
+
<div class="col-6">
+
<h1></h1>
+
</div>
+
</div>
+
 
+
<div class="row">
+
<div class="col-10 offset-1">
+
<!--Carousel Wrapper-->
+
 
+
<div id="carousel-2" class="carousel slide" data-ride="carousel">
+
<!--Indicators-->
+
<ol class="carousel-indicators">
+
<li data-target="#carousel-2" data-slide-to="0" class="active"></li>
+
<li data-target="#carousel-2" data-slide-to="1"></li>
+
<li data-target="#carousel-2" data-slide-to="2"></li>
+
<li data-target="#carousel-2" data-slide-to="3"></li>
+
<li data-target="#carousel-2" data-slide-to="4"></li>
+
 
+
 
+
</ol>
+
<!--/.Indicators-->
+
<!--Slides-->
+
<div class="carousel-inner" role="listbox" style="height: 600px;">
+
<div class="carousel-item active">
+
<div class="view text-center">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/1/1e/T--SZU-China--Ad_Weizhao.jpg" alt="First slide">
+
<div class="mask rgba-black-light"></div>
+
 
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Weizhao Chen</h3>
+
<h5>PI</h5>
+
<p style="padding: 40px;">
+
He is the Deputy Director of the experimental Teaching Center of Biological Sciences, Shenzhen University. He is a wonderful teacher.</p>
+
 
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/0/04/T--SZU-China--Ad_Ning.jpg" alt="Second slide">
+
<div class="mask rgba-black-strong"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Ning Xie</h3>
+
<h5>PI</h5>
+
<p style="padding: 40px;">
+
Dr. Ning Xie, professor in the College of Life Science,Shenzhen university, China. He is really willing to provide help for students.
+
</p>
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/6/6b/T--SZU-China--Mo.jpg" alt="Third slide">
+
<div class="mask rgba-black-slight"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Beixin Mo</h3>
+
<h5>Advisors</h5>
+
<p style="padding: 40px;">
+
Professor Mo, the vice-president of College of Life Science in Shenzhen University, keen on the reserch of epigenetics.
+
 
+
</p>
+
</div>
+
</div>
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/a/a4/T--SZU-China--Ad_Yanling.jpg" alt="Third slide">
+
<div class="mask rgba-black-slight"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Yanling Qiu</h3>
+
<h5>Advisors</h5>
+
<p style="padding: 40px;">
+
She is a postgraduate in chemical engineering and biology who come from SZU-China. Her current research interests are molecular biology, bioenergy. The girl is enthusiastic about science.
+
</p>
+
</div>
+
</div>
+
+
<div class="carousel-item">
+
<!--Mask color-->
+
<div class="view">
+
<img class="d-block mx-auto" width="300px" src="https://static.igem.org/mediawiki/2018/c/c9/T--SZU-China--Jiantao.jpg" alt="Second slide">
+
<div class="mask rgba-black-strong"></div>
+
</div>
+
<div class="carousel-caption">
+
<h3 class="h3-responsive">Jiantao Zhang</h3>
+
<h5>Advisors</h5>
+
<p style="padding: 40px;">
+
He is an undergraduate from Shenzhen University who majors in clinical medicine. He is responsible and diligent and has a thing for basketball. He is open to public basketball challenges, so feel free to contact him.
+
 
+
</p>
+
</div>
+
</div>
+
  
<!--/.Slides-->
+
<head>
<!--Controls-->
+
  <meta charset="UTF-8" />
<a class="carousel-control-prev" href="#carousel-2" role="button" data-slide="prev">
+
  <title>Document</title>
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
+
</head>
<span class="sr-only">Previous</span>
+
</a>
+
<a class="carousel-control-next" href="#carousel-2" role="button" data-slide="next">
+
<span class="carousel-control-next-icon" aria-hidden="true"></span>
+
<span class="sr-only">Next</span>
+
</a>
+
<!--/.Controls-->
+
</div>
+
<!--/.Carousel Wrapper-->
+
</div>
+
</div>
+
<!--
+
<div class="row">
+
<div class="col-lg-3 col-md-6">
+
<div class="card border shadow">
+
<img class="card-img-top" src="https://static.igem.org/mediawiki/2018/1/1e/T--SZU-China--Ad_Weizhao.jpg" />
+
</div>
+
<div class="card-body">
+
<h3>Weizhao Chen</h3>
+
<p>
+
He is the Deputy Director of the experimental Teaching Center of Biological Sciences, Shenzhen University. He is a wonderful teacher.</p>
+
  
</div>
+
<body>
</div>
+
  <div class="container">
<div class="col-lg-3 col-md-6">
+
    <div class="block-grid">
<div class="card border">
+
      <div class="block-panel">
<img class="card-img-top" src="https://static.igem.org/mediawiki/2018/0/04/T--SZU-China--Ad_Ning.jpg" />
+
        <div class="block-content">
</div>
+
          <h1>title 1</h1>
<div class="card-body">
+
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga
<h3>Ning Xie</h3>
+
            ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit.
<p>
+
            Adipisci fuga ducimus nobis.</p>
Dr. Ning Xie, professor in the College of Life Science,Shenzhen university, China. He is really willing to provide help for students.
+
</p>
+
</div>
+
</div>
+
<div class="col-lg-3 col-md-6">
+
<div class="card border">
+
<img class="card-img-top" src="https://static.igem.org/mediawiki/2018/a/a4/T--SZU-China--Ad_Yanling.jpg" />
+
</div>
+
<div class="card-body">
+
<h3>Yanling Qiu</h3>
+
<p>
+
She is a postgraduate in chemical engineering and biology who come from SZU-China. Her current research interests are molecular biology, bioenergy. The girl is enthusiastic about science.
+
</p>
+
</div>
+
</div>
+
<div class="col-lg-3 col-md-6">
+
<div class="card border">
+
<img class="card-img-top" src="https://static.igem.org/mediawiki/2018/c/c9/T--SZU-China--Jiantao.jpg" />
+
</div>
+
<div class="card-body">
+
<h3>Jiantao Zhang</h3>
+
<p>
+
He is an undergraduate from Shenzhen University who majors in clinical medicine. He is responsible and diligent and has a thing for basketball. He is open to public basketball challenges, so feel free to contact him.</p>
+
  
</div>
+
        </div>
</div>
+
      </div>
 +
      <div class="block-panel">
 +
        <div class="block-content">
 +
          <h1>title 2</h1>
 +
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.</p>
 +
        </div>
 +
      </div>
 +
      <div class="block-panel">
 +
        <div class="block-content">
 +
          <h1>title 3</h1>
 +
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis</p>
 +
        </div>
 +
      </div>
 +
      <div class="block-panel">
 +
        <div class="block-content">
 +
          <h1>Advantage</h1>
 +
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis</p>
 +
        </div>
 +
      </div>
 +
      <div class="block-panel">
 +
        <div class="block-content">
 +
          <h1>title 5</h1>
 +
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobisorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.</p>
 +
        </div>
 +
      </div>
 +
      <div class="block-panel">
 +
        <div class="block-content">
 +
          <h1>title 6</h1>
 +
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.</p>
 +
        </div>
 +
      </div>
 +
      <div class="block-panel">
 +
        <div class="block-content">
 +
          <h1>title 7</h1>
 +
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.orem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobisorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga
 +
            ducimus nobis</p>
 +
        </div>
 +
      </div>
 +
      <div class="block-panel">
 +
        <div class="block-content">
 +
          <h1>title 8</h1>
 +
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.</p>
 +
        </div>
 +
      </div>
 +
    </div>
  
</div>
 
-->
 
</div>
 
  
</div>
+
  </div>
  
</body>
+
  </div>
  
<script>
+
</body>
// When the DOM is ready, run this function
+
$(document).ready(function() {
+
//Set the carousel options
+
$(function() {
+
$('.carousel').carousel({
+
interval: 6000
+
});
+
});
+
});
+
</script>
+
  
 +
</html>
 +
<!-- partial -->
 +
 
 +
</body>
 
</html>
 
</html>

Revision as of 16:02, 14 October 2019

masonry grid css Document

title 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.

title 2

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.

title 3

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis

Advantage

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis

title 5

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobisorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.

title 6

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.

title 7

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.orem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobisorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis

title 8

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fuga ducimus nobis.

</body> </html>