Difference between revisions of "Team:BNU-China"

Line 1: Line 1:
 
{{BNU-China}}
 
{{BNU-China}}
 +
<!DOCTYPE HTML>
 
<html>
 
<html>
 +
<head>
 +
<title>About</title>
 +
<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
 +
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
 +
<script src="js/jquery-1.11.0.min.js"></script>
 +
<link href="css/style.css" rel="stylesheet" type="text/css"/>
 +
<meta name="viewport" content="width=device-width, initial-scale=1">
 +
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
 +
<!-- Google Fonts -->
 +
<link href='https://fonts.googleapis.com/css?family=PT+Sans:400,700' rel='stylesheet' type='text/css'>
 +
<!-- Google Fonts -->
 +
<script type="text/javascript" src="js/jquery.mixitup.min.js"></script>
 +
<script type="text/javascript">
 +
$(function () {
 +
 +
var filterList = {
 +
 +
init: function () {
 +
 +
// MixItUp plugin
 +
// http://mixitup.io
 +
$('#portfoliolist').mixitup({
 +
targetSelector: '.portfolio',
 +
filterSelector: '.filter',
 +
effects: ['fade'],
 +
easing: 'snap',
 +
// call the hover effect
 +
onMixEnd: filterList.hoverEffect()
 +
});
 +
 +
},
 +
 +
hoverEffect: function () {
 +
 +
// Simple parallax effect
 +
$('#portfoliolist .portfolio').hover(
 +
function () {
 +
$(this).find('.label').stop().animate({bottom: 0}, 200, 'easeOutQuad');
 +
$(this).find('img').stop().animate({top: -30}, 500, 'easeOutQuad');
 +
},
 +
function () {
 +
$(this).find('.label').stop().animate({bottom: -40}, 200, 'easeInQuad');
 +
$(this).find('img').stop().animate({top: 0}, 300, 'easeOutQuad');
 +
}
 +
);
 +
 +
}
  
 +
};
 +
 +
// Run the show!
 +
filterList.init();
 +
 +
 +
});
 +
</script>
 +
<script type="text/javascript" src="js/easing.js"></script>
 +
<script type="text/javascript">
 +
jQuery(document).ready(function($) {
 +
$(".scroll").click(function(event){
 +
event.preventDefault();
 +
$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
 +
});
 +
});
 +
</script>
 +
</head>
 +
<body>
 +
<!--- Header Starts Here ---->
 +
<div class="header" id="home">
 +
<div class="container">
 +
<div class="logos">
 +
<a href="index.html"><img src="images/logo.png" alt=""></a>
 +
</div>
 +
<!--- banner Slider starts Here -->
 +
  <script src="js/responsiveslides.min.js"></script>
 +
<script>
 +
    // You can also use "$(window).load(function() {"
 +
    $(function () {
 +
      // Slideshow 4
 +
      $("#slider4").responsiveSlides({
 +
        auto: true,
 +
        pager: true,
 +
        nav: true,
 +
        speed: 500,
 +
        namespace: "callbacks",
 +
        before: function () {
 +
          $('.events').append("<li>before event fired.</li>");
 +
        },
 +
        after: function () {
 +
          $('.events').append("<li>after event fired.</li>");
 +
        }
 +
      });
 +
 +
    });
 +
  </script>
 +
<!--//End-slider-script-->
 +
<!-- Slideshow 4 -->
 +
    <div  id="top" class="callbacks_container">
 +
      <ul class="rslides" id="slider4">
 +
        <li>
 +
        <div class="slide-content">
 +
<h2>Welcome to iK!</h2>
 +
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod<br> tempor incididunt ut labore et dolore magna aliqua.</p>
 +
<a href="">Contact us</a>
 +
</div>
 +
</li>
 +
<li>
 +
        <div class="slide-content">
 +
<h2>Awesome Day!</h2>
 +
<p>dolor sit amet, Lorem ipsum consectetur adipisicing elit, sed do eiusmod<br> tempor incididunt ut labore et dolore magna aliqua.</p>
 +
<a href="">Contact us</a>
 +
</div>
 +
</li>
 +
<li>
 +
        <div class="slide-content">
 +
<h2>Let's work to iK!</h2>
 +
<p>consectetur Lorem ipsum dolor sit amet, adipisicing elit, sed do eiusmod<br> tempor incididunt ut labore et dolore magna aliqua.</p>
 +
<a href="">Contact us</a>
 +
</div>
 +
</li>
 +
      </ul>
 +
    </div>
 +
</div>
 +
</div>
 +
<!--- Header Ends Here ---->
 +
<!-- Navigation Starts Here ---->
 +
<!-- top-nav -->
 +
 +
<div class="top-nav">
 +
<nav>
 +
<span class="menu"></span>
 +
<ul>
 +
<li><a href="#about" class="scroll">About Us</a></li>
 +
<li><a href="#work" class="scroll">Work</a></li>
 +
<li class="active"><a href="#home" class="scroll">Home</a></li>
 +
<li><a href="#service" class="scroll">Service</a></li>
 +
<li><a href="#contact" class="scroll">Contact</a></li>
 +
<div class="clearfix"> </div>
 +
</ul>
 +
</nav>
 +
</div>
 +
<script>
 +
$( "span.menu" ).click(function() {
 +
  $( ".top-nav ul" ).slideToggle( "slow", function() {
 +
    // Animation complete.
 +
  });
 +
});
 +
</script>
  
 +
<script src="js/myscript.js"> </script>
 +
<!-- top-nav -->
 +
<!--- Navigarion Ends Here ---><div class="copyrights">Collect from <a href="http://www.cssmoban.com/" >企业网站模板</a></div>
 +
<!--- About Us Starts Here ---->
 +
<div class="about" id="about">
 +
<div class="container">
 +
<h3 class="top-title">About us</h3>
 +
<h4>Why Us?</h4>
 +
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
 +
<p class="show-not">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
 +
<div class="row about-row">
 +
<div class="col-md-3 about-row-column">
 +
<img src="images/men-a.jpg" alt=""/>
 +
</div>
 +
<div class="col-md-9 about-column">
 +
<h3>Jon Doe</h3>
 +
<h4>Subtitle</h4>
 +
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in </p>
 +
<h5>Skills</h5>
 +
<div id="progressbar"><div id="progress" ><div id="pbaranim">11%</div></div></div>
 +
<ul class="social">
 +
<li><i class="fa"></i></li>
 +
<li><i class="tw"></i></li>
 +
<li><i class="in"></i></li>
 +
<li><i class="pw"></i></li>
 +
</ul>
 +
</div>
 +
<div class="clearfix"></div>
 +
</div>
 +
<div class="row about-row">
 +
<div class="col-md-9 about-column">
 +
<h3>Jon Doe</h3>
 +
<h4>Subtitle</h4>
 +
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in </p>
 +
<h5>Skills</h5>
 +
<div id="progressbar"><div id="progress" ><div id="pbaranim">11%</div></div></div>
 +
<ul class="social">
 +
<li><i class="fa"></i></li>
 +
<li><i class="tw"></i></li>
 +
<li><i class="in"></i></li>
 +
<li><i class="pw"></i></li>
 +
</ul>
 +
</div>
 +
<div class="col-md-3 about-row-column">
 +
<img src="images/men-b.jpg" alt=""/>
 +
</div>
 +
<div class="clearfix"></div>
 +
</div>
 +
<div class="row about-row">
 +
<div class="col-md-3 about-row-column">
 +
<img src="images/men-c.jpg" alt=""/>
 +
</div>
 +
<div class="col-md-9 about-column">
 +
<h3>Jon Doe</h3>
 +
<h4>Subtitle</h4>
 +
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in </p>
 +
<h5>Skills</h5>
 +
<div id="progressbar"><div id="progress" ><div id="pbaranim">11%</div></div></div>
 +
<ul class="social">
 +
<li><i class="fa"></i></li>
 +
<li><i class="tw"></i></li>
 +
<li><i class="in"></i></li>
 +
<li><i class="pw"></i></li>
 +
</ul>
 +
</div>
 +
<div class="clearfix"></div>
 +
</div>
 +
<!-- Testimonial Starts here -->
 +
<div class="testimonial">
 +
<h3 class="top-title">Testimonials</h3>
 +
<h4>What People said about us</h4>
 +
<script>
 +
    // You can also use "$(window).load(function() {"
 +
    $(function () {
 +
      // Slideshow 4
 +
      $("#slider2").responsiveSlides({
 +
        auto: true,
 +
        pager: true,
 +
        nav: true,
 +
        speed: 500,
 +
        namespace: "callbacks",
 +
        before: function () {
 +
          $('.events').append("<li>before event fired.</li>");
 +
        },
 +
        after: function () {
 +
          $('.events').append("<li>after event fired.</li>");
 +
        }
 +
      });
 +
 +
    });
 +
  </script>
 +
<div  id="top" class="callbacks_container">
 +
      <ul class="rslides" id="slider2">
 +
        <li>
 +
<div class="testimonial-slide">
 +
<blockquote class="style1">
 +
<span>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in </span>
 +
</blockquote>
 +
<h5>John Doe, CEO</h5>
 +
</div>
 +
</li>
 +
<li>
 +
<div class="testimonial-slide">
 +
<blockquote class="style1">
 +
<span>consectetur Lorem ipsum dolor sit amet, adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in </span>
 +
</blockquote>
 +
<h5>Doe John, CEO</h5>
 +
</div>
 +
</li>
 +
<li>
 +
<div class="testimonial-slide">
 +
<blockquote class="style1">
 +
<span>dolor sit amet,Lorem ipsum consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in </span>
 +
</blockquote>
 +
<h5>Doe Aaron, CEO</h5>
 +
</div>
 +
</li>
 +
</ul>
 +
</div>
 +
</div>
 +
<!--- Testimonial Ends here --->
 +
</div>
 +
</div>
 +
<!- About Us Ends Here -->
 +
<!--- Featured Work Starts Here -->
 +
<div class="feature" id="work">
 +
<div class="container">
 +
<h3 class="top-title">Featured Work</h3>
 +
<div class="portfolio">
 +
<ul id="filters" class="clearfix">
 +
<li><span class="filter" data-filter="app card icon logo web">All items</span></li>
 +
<li><span class="filter" data-filter="app"> webdesign</span></li>
 +
<li><span class="filter active" data-filter="card">graphic design</span></li>
 +
<li><span class="filter" data-filter="icon">Illustration</span></li>
 +
<li><span class="filter" data-filter="logo"> photography</span></li>
 +
</ul>
 +
<div id="portfoliolist">
 +
<div class="portfolio app mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
 +
<div class="portfolio-wrapper">
 +
<a href="#small-dialog" class="b-link-stripe b-animate-go  thickbox popup-with-zoom-anim">
 +
    <img src="images/pic1.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/icon-eye.png" alt=""/></h2>
 +
  <p class="b-animate b-from-right    b-delay03 ">Lorem ipsum dolor sit amet.<br><span class="m_4">Photography</span></p></div></a>
 +
                </div>
 +
</div>
 +
<div class="portfolio icon mix_all" data-cat="icon" style="display: inline-block; opacity: 1;">
 +
<div class="portfolio-wrapper">
 +
<a href="#small-dialog1" class="b-link-stripe b-animate-go  thickbox popup-with-zoom-anim">
 +
    <img src="images/pic2.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/icon-eye.png" alt=""/></h2>
 +
  <p class="b-animate b-from-right    b-delay03 ">Lorem ipsum dolor sit amet.<br><span class="m_4">Photography</span></p></div></a>
 +
                </div>
 +
</div>
 +
<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
 +
<div class="portfolio-wrapper">
 +
<a href="#small-dialog2" class="b-link-stripe b-animate-go  thickbox popup-with-zoom-anim">
 +
    <img src="images/pic5.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/icon-eye.png" alt=""/></h2>
 +
  <p class="b-animate b-from-right    b-delay03 ">Lorem ipsum dolor sit amet.<br><span class="m_4">Photography</span></p></div></a>
 +
                </div>
 +
</div>
 +
<div class="portfolio logo mix_all" data-cat="logo" style="display: inline-block; opacity: 1;">
 +
<div class="portfolio-wrapper">
 +
<a href="#small-dialog3" class="b-link-stripe b-animate-go  thickbox popup-with-zoom-anim">
 +
    <img src="images/pic3.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/icon-eye.png" alt=""/></h2>
 +
  <p class="b-animate b-from-right    b-delay03 ">Lorem ipsum dolor sit amet.<br><span class="m_4">Photography</span></p></div></a>
 +
                </div>
 +
</div>
 +
<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
 +
<div class="portfolio-wrapper">
 +
<a href="#small-dialog4" class="b-link-stripe b-animate-go  thickbox popup-with-zoom-anim">
 +
    <img src="images/pic4.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/icon-eye.png" alt=""/></h2>
 +
  <p class="b-animate b-from-right    b-delay03 ">Lorem ipsum dolor sit amet.<br><span class="m_4">Photography</span></p></div></a>
 +
                </div>
 +
</div>
 +
<div class="portfolio app mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
 +
<div class="portfolio-wrapper">
 +
<a href="#small-dialog5" class="b-link-stripe b-animate-go  thickbox popup-with-zoom-anim">
 +
    <img src="images/pic6.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/icon-eye.png" alt=""/></h2>
 +
  <p class="b-animate b-from-right    b-delay03 ">Lorem ipsum dolor sit amet.<br><span class="m_4">Photography</span></p></div></a>
 +
                </div>
 +
</div>
 +
<div class="portfolio logo mix_all" data-cat="logo" style="display: inline-block; opacity: 1;">
 +
<div class="portfolio-wrapper">
 +
<a href="#small-dialog6" class="b-link-stripe b-animate-go  thickbox popup-with-zoom-anim">
 +
    <img src="images/pic8.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/icon-eye.png" alt=""/></h2>
 +
  <p class="b-animate b-from-right    b-delay03 ">Lorem ipsum dolor sit amet.<br><span class="m_4">Photography</span></p></div></a>
 +
                </div>
 +
</div>
 +
<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
 +
<div class="portfolio-wrapper">
 +
<a href="#small-dialog7" class="b-link-stripe b-animate-go  thickbox popup-with-zoom-anim">
 +
    <img src="images/pic7.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/icon-eye.png" alt=""/></h2>
 +
  <p class="b-animate b-from-right    b-delay03 ">Lorem ipsum dolor sit amet.<br><span class="m_4">Photography</span></p></div></a>
 +
                </div>
 +
</div>
 +
<div class="portfolio app mix_all"  data-cat="app" style="display: inline-block; opacity: 1;">
 +
<div class="portfolio-wrapper">
 +
<a href="#small-dialog8" class="b-link-stripe b-animate-go  thickbox popup-with-zoom-anim">
 +
    <img src="images/pic9.jpg" class="img-hid" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 "><img src="images/icon-eye.png" alt=""/></h2>
 +
  <p class="b-animate b-from-right    b-delay03 ">Lorem ipsum dolor sit amet.<br><span class="m_4">Photography</span></p></div></a>
 +
                </div>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="clearfix"></div>
 +
<!---pop-up-box---->
 +
  <script type="text/javascript" src="js/modernizr.custom.min.js"></script>   
 +
<link href="css/popuo-box.css" rel="stylesheet" type="text/css" media="all"/>
 +
<script src="js/jquery.magnific-popup.js" type="text/javascript"></script>
 +
<!---//pop-up-box---->
 +
<div id="small-dialog" class="mfp-hide">
 +
<div class="image-top">
 +
<img src="images/pic1.jpg" alt=""/>
 +
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
 +
</div>
 +
</div>
 +
<div id="small-dialog1" class="mfp-hide">
 +
<div class="image-top">
 +
<img src="images/pic2.jpg" alt=""/>
 +
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
 +
</div>
 +
</div>
 +
<div id="small-dialog2" class="mfp-hide">
 +
<div class="image-top">
 +
<img src="images/pic5.jpg" alt=""/>
 +
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
 +
</div>
 +
</div>
 +
<div id="small-dialog3" class="mfp-hide">
 +
<div class="image-top">
 +
<img src="images/pic3.jpg" alt=""/>
 +
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
 +
</div>
 +
</div>
 +
<div id="small-dialog4" class="mfp-hide">
 +
<div class="image-top">
 +
<img src="images/pic4.jpg" alt=""/>
 +
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
 +
</div>
 +
</div>
 +
<div id="small-dialog5" class="mfp-hide">
 +
<div class="image-top">
 +
<img src="images/pic6.jpg" alt=""/>
 +
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
 +
</div>
 +
</div>
 +
<div id="small-dialog6" class="mfp-hide">
 +
<div class="image-top">
 +
<img src="images/pic8.jpg" alt=""/>
 +
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
 +
</div>
 +
</div>
 +
<div id="small-dialog7" class="mfp-hide">
 +
<div class="image-top">
 +
<img src="images/pic7.jpg" alt=""/>
 +
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
 +
</div>
 +
</div>
 +
<div id="small-dialog8" class="mfp-hide">
 +
<div class="image-top">
 +
<img src="images/pic9.jpg" alt=""/>
 +
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
 +
</div>
 +
</div>
 +
<script>
 +
$(document).ready(function() {
 +
$('.popup-with-zoom-anim').magnificPopup({
 +
type: 'inline',
 +
fixedContentPos: false,
 +
fixedBgPos: true,
 +
overflowY: 'auto',
 +
closeBtnInside: true,
 +
preloader: false,
 +
midClick: true,
 +
removalDelay: 300,
 +
mainClass: 'my-mfp-zoom-in'
 +
});
 +
 +
});
 +
</script>
  
 +
<!---Services Starts Here ---->
 +
<div class="services" id="service">
 +
<h3 class="top-title">Our Services</h3>
 +
<div class="row services-row">
 +
<div class="col-md-4 services-column">
 +
<h4>Mobile Design</h4>
 +
<i class="icon1"></i>
 +
<p>sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
 +
</div>
 +
<div class="col-md-4 services-column">
 +
<h4>Web Development</h4>
 +
<i class="icon2"></i>
 +
<p>sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
 +
</div>
 +
<div class="col-md-4 services-column">
 +
<h4>Markting</h4>
 +
<i class="icon3"></i>
 +
<p>sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
 +
</div>
 +
<div class="clearfix"></div>
 +
</div>
 +
</div>
 +
<!---Services Ends Here ---->
 +
</div>
 +
</div>
 +
<!-- Featured Work Ends Here -->
 +
<!--- Contact-starts Here -->
 +
<div class="contact" id="contact">
 +
<div class="contact-map">
 +
<iframe src=""></iframe>
 +
</div>
 +
<div class="contact-top">
 +
<h3>Contact</h3>
 +
<div class="row contact-top-row">
 +
<div class="col-md-4 contact-top-column">
 +
<address>
 +
<p>
 +
011 Street Name.</br>
 +
New York, NY, 54687<br>
 +
USA
 +
</p>
 +
<p>Phone: (555) 125-5460</p>
 +
<p>Fax: (555) 125-5460</p>
 +
<p><a href="mailto:Email@companyname.com">Email@companyname.com</a></p>
 +
</address>
 +
</div>
 +
<div class="col-md-8 contact-top-column1">
 +
<span class="text-box">
 +
<label class="text-icon"></label>
 +
<input type="text" placeholder="Name" required="">
 +
</span>
 +
<div class="text">
 +
<span class="text-box">
 +
<label class="text-icon2"></label>
 +
<input type="text" placeholder="Email" required="">
 +
</span>
 +
</div>
 +
<div class="text">
 +
<span class="text-box">
 +
<label class="text-icon3"></label>
 +
<input type="text" placeholder="Website" required="">
 +
</span>
 +
</div>
 +
<div class="text">
 +
<textarea placeholder="Message" required></textarea>
 +
</div>
 +
<div class="text">
 +
<input type="submit" value="send message">
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
<!--- Contact-Ends Here -->
 +
<!--- Footer Starts here -->
 +
<div class="footer">
 +
<ul class="footer-icons">
 +
<li><i class="fb"></i></li>
 +
<li><i class="twit"></i></li>
 +
</ul>
 +
<p class="copyright">Copyright &copy; 2016.Company name All rights reserved.More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
 +
<a href="#home" id="toTop" class="scroll" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
  
−
<div class="column full_size" >
+
</div>
−
<h1> Welcome ! </h1>
+
<!--- Footer Ends here -->
−
<p>Your team has been approved and you are ready to start the iGEM season! </p>
+
</body>
−
 
+
−
 
+
−
<img src="http://placehold.it/1080x320/c4baba/e4dede">
+
−
+
−
 
+
−
</div>  
+
−
 
+
−
 
+
−
<div class="column full_size" >
+
−
 
+
−
<h3>Before you start</h3>
+
−
<p> Please read the following pages:</p>
+
−
<ul>
+
−
<li>  <a href="https://2018.igem.org/Competition">Competition Hub</a> </li>
+
−
<li> <a href="https://2018.igem.org/Competition/Deliverables/Wiki">Wiki Requirements page</a></li>
+
−
<li> <a href="https://2018.igem.org/Resources/Template_Documentation">Template documentation</a></li>
+
−
</ul>
+
−
</div>
+
−
 
+
−
 
+
−
<div class="clear extra_space"></div>
+
−
<div class="line_divider"></div>
+
−
<div class="clear extra_space"></div>
+
−
 
+
−
 
+
−
 
+
−
<div class="column full_size" >
+
−
<h3> Styling your wiki </h3>
+
−
<p>You may style this page as you like or you can simply leave the style as it is. You can easily keep the styling and edit the content of these default wiki pages with your project information and completely fulfill the requirement to document your project.</p>
+
−
<p>While you may not win Best Wiki with this styling, your team is still eligible for all other awards. This default wiki meets the requirements, it improves navigability and ease of use for visitors, and you should not feel it is necessary to style beyond what has been provided.</p>
+
−
 
+
−
</div>
+
−
 
+
−
 
+
−
 
+
−
 
+
−
<div class="clear extra_space"></div>
+
−
 
+
−
 
+
−
 
+
−
<div class="column third_size" >
+
−
 
+
−
<h3> Uploading pictures and files </h3>
+
−
<p> You must upload any pictures and files to the iGEM 2018 server. Remember to keep all your pictures and files within your team's namespace or at least include your team's name in the file name. </p>
+
−
 
+
−
 
+
−
<p>When you upload, set the "Destination Filename" to <b> T--YourOfficialTeamName--NameOfFile.jpg</b>. (If you don't do this, someone else might upload a different file with the same "Destination Filename", and your file would be erased!)</p>
+
−
 
+
−
<div class="button_link">
+
−
<a href="https://2018.igem.org/Special:Upload">
+
−
UPLOAD FILES
+
−
</a>
+
−
</div>
+
−
 
+
−
</div>
+
−
 
+
−
<div class="column third_size" >
+
−
<h3> Wiki template information </h3>
+
−
<p>We have created these wiki template pages to help you get started and to help you think about how your team will be evaluated. You can find a list of all the pages tied to awards here at the <a href="https://2018.igem.org/Judging/Pages_for_Awards">Pages for awards</a> link. You must edit these pages to be evaluated for medals and awards, but ultimately the design, layout, style and all other elements of your team wiki is up to you!</p>
+
−
 
+
−
</div>
+
−
 
+
−
 
+
−
 
+
−
<div class="column third_size" >
+
−
<div class="highlight decoration_B_full">
+
−
<h3> Editing your wiki </h3>
+
−
<p>On this page you can document your project, introduce your team members, document your progress and share your iGEM experience with the rest of the world! </p>
+
−
<p>Use WikiTools - Edit in the black menu bar to edit this page</p>
+
−
 
+
−
<div class="button_link">
+
−
<a href="https://2018.igem.org/wiki/index.php?title=Team:BNU-China&action=edit">
+
−
EDIT PAGE
+
−
</a>
+
−
</div>
+
−
 
+
−
 
+
−
</div>
+
−
</div>
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
<div class="clear extra_space"></div>
+
−
<div class="line_divider"></div>
+
−
<div class="clear extra_space"></div>
+
−
 
+
−
 
+
−
 
+
−
<div class="column two_thirds_size" >
+
−
<h3>Tips</h3>
+
−
<p>This wiki will be your team’s first interaction with the rest of the world, so here are a few tips to help you get started: </p>
+
−
<ul>
+
−
<li>State your accomplishments! Tell people what you have achieved from the start. </li>
+
−
<li>Be clear about what you are doing and how you plan to do this.</li>
+
−
<li>You have a global audience! Consider the different backgrounds that your users come from.</li>
+
−
<li>Make sure information is easy to find; nothing should be more than 3 clicks away.  </li>
+
−
<li>Avoid using very small fonts and low contrast colors; information should be easy to read.  </li>
+
−
<li>Start documenting your project as early as possible; don’t leave anything to the last minute before the Wiki Freeze. For a complete list of deadlines visit the <a href="https://2018.igem.org/Calendar">iGEM 2018 calendar</a> </li>
+
−
<li>Have lots of fun! </li>
+
−
</ul>
+
−
</div>
+
−
 
+
−
 
+
−
<div class="column third_size">
+
−
<div class="highlight decoration_A_full">
+
−
<h3>Inspiration</h3>
+
−
<p> You can also view other team wikis for inspiration! Here are some examples:</p>
+
−
<ul>
+
−
<li> <a href="https://2014.igem.org/Team:SDU-Denmark/"> 2014 SDU Denmark </a> </li>
+
−
<li> <a href="https://2014.igem.org/Team:Aalto-Helsinki">2014 Aalto-Helsinki</a> </li>
+
−
<li> <a href="https://2014.igem.org/Team:LMU-Munich">2014 LMU-Munich</a> </li>
+
−
<li> <a href="https://2014.igem.org/Team:Michigan"> 2014 Michigan</a></li>
+
−
<li> <a href="https://2014.igem.org/Team:ITESM-Guadalajara">2014 ITESM-Guadalajara </a></li>
+
−
<li> <a href="https://2014.igem.org/Team:SCU-China"> 2014 SCU-China </a></li>
+
−
</ul>
+
−
</div>
+
−
</div>
+
−
 
+
−
 
+
−
 
+
−
 
+
 
</html>
 
</html>

Revision as of 02:11, 24 June 2018

<!DOCTYPE HTML> About

  • Welcome to iK!

    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
    tempor incididunt ut labore et dolore magna aliqua.

    Contact us

  • Awesome Day!

    dolor sit amet, Lorem ipsum consectetur adipisicing elit, sed do eiusmod
    tempor incididunt ut labore et dolore magna aliqua.

    Contact us

  • Let's work to iK!

    consectetur Lorem ipsum dolor sit amet, adipisicing elit, sed do eiusmod
    tempor incididunt ut labore et dolore magna aliqua.

    Contact us
Collect from 企业网站模板

About us

Why Us?

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Jon Doe

Subtitle

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in

Skills
11%

Jon Doe

Subtitle

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in

Skills
11%

Jon Doe

Subtitle

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in

Skills
11%

Testimonials

What People said about us

  • Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
    John Doe, CEO
  • consectetur Lorem ipsum dolor sit amet, adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
    Doe John, CEO
  • dolor sit amet,Lorem ipsum consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
    Doe Aaron, CEO

Featured Work

  • All items
  • webdesign
  • graphic design
  • Illustration
  • photography

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Our Services

Mobile Design

sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Web Development

sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Markting

sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Contact

011 Street Name.
New York, NY, 54687
USA

Phone: (555) 125-5460

Fax: (555) 125-5460

Email@companyname.com

Copyright © 2016.Company name All rights reserved.More Templates 模板之家 - Collect from 网页模板