Difference between revisions of "Team:BGU Israel/Notebook"

 
(109 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
{{BGU_Israel}}
 
{{BGU_Israel}}
<!DOCTYPE html>
+
 
 +
{{Template:BGU_Israel/header}}
 +
 
 
<html lang="en">
 
<html lang="en">
 
<head>
 
<head>
 +
 +
</head>
 +
<body id="myPage"  data-spy="scroll" data-target=".navbar #myScrollspy" data-offset="60">
 
    
 
    
   <title>OriginALS</title>
+
   <header style="background-image:url('https://static.igem.org/mediawiki/2018/f/f0/T--BGU_Israel--pink_subhead.png')!important;" class="sub-page-header text-center">
  <meta charset="utf-8">
+
      <div class="container my-auto">
  <meta name="viewport" content="width=device-width, initial-scale=1">
+
          <h1 class="animated fadeInUp">Notebook</h1>
    <link type="text/css" rel="stylesheet" href="style.css">
+
      </div>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+
    </header>
  <link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet" type="text/css">
+
<style >
  <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet" type="text/css">
+
.sub-nav .bg-grey{
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+
padding-top:0px;
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
+
padding-bottom:0px;
<style>
+
    body {
+
      font: 400 15px Segoe UI !important;
+
      line-height: 1.8;
+
      color: #818181;
+
  }
+
  h1 {
+
      font-size: 32px!important;
+
      font-family: Segoe UI Light!important;
+
      text-transform: capitalize;
+
      color: #303030;
+
      font-weight: 600;
+
      margin-bottom: 30px !important;
+
   
+
  }
+
  h4 {
+
      font-size: 19px;
+
      line-height: 1.375em;
+
      color: #303030;
+
      font-weight: 400;
+
      margin-bottom: 30px;
+
  } 
+
      p, ol {
+
          font-size: 16px !important;
+
         
+
          color:#010101 !important;
+
      }
+
  .jumbotron {
+
      background-color: #f4511e;
+
      color: #fff;
+
      padding: 100px 25px;
+
      font-family: Montserrat, sans-serif;
+
  }
+
  .container-fluid {
+
      padding: 60px 50px;
+
  }
+
 
+
    .bg-grey {
+
        background-color:#ededed;
+
        color:#000;
+
        padding: 60px 50px;
+
    }
+
    .bg-white {
+
        background-color:#fff;
+
        color:#000;
+
        padding: 60px 50px;
+
    }
+
    .bg-dark {
+
        background-color:#262626;
+
        color:#fff !important;
+
        padding: 60px 50px;
+
    }
+
    .bg-dark p, .bg-dark h1 {
+
        color:#fff !important;
+
       
+
    }
+
  .logo-small {
+
      color: #f4511e;
+
      font-size: 50px;
+
  }
+
  .logo {
+
      color: #f4511e;
+
      font-size: 200px;
+
  }
+
  .thumbnail {
+
      padding: 0 0 15px 0;
+
      border: none;
+
      border-radius: 0;
+
  }
+
  .thumbnail img {
+
      width: 100%;
+
      height: 100%;
+
      margin-bottom: 10px;
+
  }
+
  .carousel-control.right, .carousel-control.left {
+
      background-image: none;
+
      color: #f4511e;
+
  }
+
  .carousel-indicators li {
+
      border-color: #f4511e;
+
  }
+
  .carousel-indicators li.active {
+
      background-color: #f4511e;
+
  }
+
  .item h4 {
+
      font-size: 19px;
+
      line-height: 1.375em;
+
      font-weight: 400;
+
      font-style: italic;
+
      margin: 70px 0;
+
  }
+
  .item span {
+
      font-style: normal;
+
  }
+
  .panel {
+
      border: 1px solid #f4511e;
+
      border-radius:0 !important;
+
      transition: box-shadow 0.5s;
+
  }
+
  .panel:hover {
+
      box-shadow: 5px 0px 40px rgba(0,0,0, .2);
+
  }
+
  .panel-footer .btn:hover {
+
      border: 1px solid #f4511e;
+
      background-color: #fff !important;
+
      color: #f4511e;
+
  }
+
  .panel-heading {
+
      color: #fff !important;
+
      background-color: #f4511e !important;
+
      padding: 25px;
+
      border-bottom: 1px solid transparent;
+
      border-top-left-radius: 0px;
+
      border-top-right-radius: 0px;
+
      border-bottom-left-radius: 0px;
+
      border-bottom-right-radius: 0px;
+
  }
+
  .panel-footer {
+
      background-color: white !important;
+
  }
+
  .panel-footer h3 {
+
      font-size: 32px;
+
  }
+
  .panel-footer h4 {
+
      color: #aaa;
+
      font-size: 14px;
+
  }
+
  .panel-footer .btn {
+
      margin: 15px 0;
+
      background-color: #f4511e;
+
      color: #fff;
+
  }
+
  .navbar {
+
      margin-bottom: 10px; !important;
+
      background-color: #fff !important;
+
      z-index: 9999!important;
+
      border: 0 !important;
+
    text-transform:uppercase !important;
+
      border-radius: 0 !important;
+
      font-family: 'Segoe UI Light'!important;
+
      font-weight: 600!important;
+
      color:#000!important;
+
padding-top:10px;
+
  }
+
  .navbar-brand {
+
  padding: 0px;
+
 
}
 
}
.navbar-brand>img {
+
.sub-nav .btn-info {
  height: 100%;
+
margin:10px 5px;
  padding: 0 0 10px 20px;
+
padding:15px 30px !important;
  width: auto;
+
}
+
  .navbar-nav li a:hover, .navbar-nav li.active a {
+
      color: #0186ac !important;
+
      background-color: #fff !important;
+
  }
+
  .navbar-default .navbar-toggle {
+
      border-color: transparent;
+
      color: #fff !important;
+
  }
+
 
+
  .slideanim {visibility:hidden;}
+
  .slide {
+
      animation-name: slide;
+
      -webkit-animation-name: slide;
+
      animation-duration: 1s;
+
      -webkit-animation-duration: 1s;
+
      visibility: visible;
+
  }
+
  @keyframes slide {
+
    0% {
+
      opacity: 0;
+
      transform: translateY(70%);
+
    }
+
    100% {
+
      opacity: 1;
+
      transform: translateY(0%);
+
    }
+
  }
+
  @-webkit-keyframes slide {
+
    0% {
+
      opacity: 0;
+
      -webkit-transform: translateY(70%);
+
    }
+
    100% {
+
      opacity: 1;
+
      -webkit-transform: translateY(0%);
+
    }
+
  }
+
  @media screen and (max-width: 768px) {
+
    .col-sm-4 {
+
      text-align: center;
+
      margin: 25px 0;
+
    }
+
    .btn-lg {
+
        width: 100%;
+
        margin-bottom: 35px;
+
    }
+
  }
+
  @media screen and (max-width: 480px) {
+
    .logo {
+
        font-size: 150px;
+
    }
+
  }
+
  
  header.masthead {
 
  padding-top: 10rem;
 
  padding-bottom: calc(10rem - 56px);
 
  background-image:url('https://static.igem.org/mediawiki/2018/2/2e/T--BGU_Israel--home_banner.jpg');
 
width:100%;
 
        overflow: hidden;
 
    min-height: 700px;
 
    /* Create the parallax scrolling effect */
 
    background-attachment: fixed;
 
    background-position: center;
 
    background-repeat: no-repeat;
 
    background-size: cover;
 
   
 
 
}
 
}
      .parallax-window {
+
.sub-nav .btn-info:hover{
    min-height: 700px;
+
background-color:#FF0161;
    background: transparent;
+
}
+
      #abstract p, #abstract ol {
+
          text-align: justify;
+
      }
+
      #myBtn {
+
  display: none;
+
         
+
  position: fixed;
+
  bottom: 20px;
+
  right: 20px;
+
  z-index: 99;
+
  font-size: 16px;
+
  border: none;
+
  outline: none;
+
  background-color: #0186ac;
+
  color: white;
+
  cursor: pointer;
+
  padding: 12px 15px 12px 15px;
+
  border-radius: 100px;
+
 
}
 
}
 +
</style>
 +
<div class="bg-dark text-center sub-nav">
 +
    <div class="container">
 +
        <div class="row animated fadeInRight">
 +
       
 +
<a href="#february" class="btn btn-info" role="button" >February</a>
 +
<a href="#march" class="btn btn-info" role="button" >March</a>
 +
<a href="#april" class="btn btn-info" role="button" >April</a>
 +
<a href="#may" class="btn btn-info" role="button" >May</a>
 +
</div>
 +
<div class="row animated fadeInLeft">
 +
<a href="#june" class="btn btn-info" role="button" >June</a>
 +
<a href="#july" class="btn btn-info" role="button" >July</a>
 +
<a href="#august" class="btn btn-info" role="button" >August</a>
 +
<a href="#experiments" class="btn btn-info" role="button" >Experiments</a>
  
#myBtn:hover {
+
         </div>
  background-color: #555;
+
}
+
 
+
    .navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
+
        background: #fff !important;
+
         color:#0186ac !important;
+
    }
+
    .navbar-right .dropdown-menu {
+
       
+
    }
+
@media screen and (min-width: 600px) {
+
    .dropdown:hover .dropdown-menu {
+
    display: block;
+
    margin-top: 0;
+
        color:#fff;
+
}
+
      #mainMenu .dropdown-menu {
+
        border:0 !important;
+
        right:auto !important;
+
        border-radius: 0 !important;
+
        text-transform: capitalize;
+
        font-size:18px;
+
    }
+
      #mainMenu .dropdown-menu li:hover {
+
        color:#0186ac !important;
+
          background: transparent;
+
    }
+
    }
+
    .gray-section {
+
        background-color:#ededed;
+
    }
+
      .sub-page-header {
+
          padding-top: 10rem;
+
  padding-bottom: calc(10rem - 56px);
+
  background-image:url('https://static.igem.org/mediawiki/2018/2/2e/T--BGU_Israel--home_banner.jpg');
+
height:200px !important;
+
 
+
    <!-- /* Create the parallax scrolling effect */ -->
+
    background-attachment: fixed;
+
background-position: top center;
+
    background-repeat: no-repeat;
+
    background-size: cover;
+
    }
+
 
+
.accordion {
+
    background-color: #ccc;
+
    color: #444;
+
    cursor: pointer;
+
    padding: 18px;
+
    width: 100%;
+
    border: none;
+
    text-align: left;
+
    outline: none;
+
    font-size: 15px;
+
    transition: 0.4s;
+
}
+
 
+
.active, .accordion:hover {
+
    background-color:  #0186ac;
+
color: #fff;
+
}
+
 
+
.accordion:after {
+
    content: '\002B';
+
    font-weight: bold;
+
    float: right;
+
    margin-left: 5px;
+
}
+
 
+
.active:after {
+
    content: "\2212";
+
color: #fff;
+
}
+
 
+
.panel2 {
+
    padding: 0 18px;
+
    max-height: 0;
+
    overflow: hidden;
+
    transition: max-height 0.2s ease-out;
+
}
+
 
+
 
+
}
+
  ul.nav-pills {
+
      top: 20px;
+
      position: fixed;
+
  }
+
  div.col-sm-9 div {
+
      height: 250px;
+
      font-size: 28px;
+
  }
+
  #section1 {color: #fff; background-color: #1E88E5;}
+
  #section2 {color: #fff; background-color: #673ab7;}
+
  #section3 {color: #fff; background-color: #ff9800;}
+
  #section41 {color: #fff; background-color: #00bcd4;}
+
  #section42 {color: #fff; background-color: #009688;}
+
 
+
  @media screen and (max-width: 810px) {
+
    #section1, #section2, #section3, #section41, #section42  {
+
        margin-left: 150px;
+
    }
+
  }
+
 
+
 
+
    </style>
+
</head>
+
<body id="myPage"  data-spy="scroll" data-target=".navbar" data-offset="60">
+
    <div id="top"></div>
+
    <a id="myBtn"  href="#top" title="To Top">
+
    <span class="glyphicon glyphicon-chevron-up"></span>
+
  </a>
+
<nav id="mainMenu" class="navbar navbar-default navbar-fixed-top">
+
  <div class="container">
+
    <div class="navbar-header">
+
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
+
        <span class="icon-bar"></span>
+
        <span class="icon-bar"></span>
+
        <span class="icon-bar"></span>                       
+
      </button>
+
      <a class="navbar-brand" href="index.html"><img src="https://static.igem.org/mediawiki/2018/3/32/T--BGU_Israel--logo_colored.png"></a>
+
 
     </div>
 
     </div>
    <div class="collapse navbar-collapse" id="myNavbar">
+
</div>
      <ul class="nav navbar-nav navbar-right">
+
<div class="arrowdown "></div>
        <li><a href="index.html">Home</a></li>
+
<!-- February -->
        <li class="dropdown">
+
<div id="february" class="bg-white text-center">
        <a class="dropdown-toggle" data-toggle="dropdown" href="https://2018.igem.org/Team:BGU_Israel/Description">Project
+
        </a>
+
        <ul class="dropdown-menu pull-right">
+
          <li><a href="https://2018.igem.org/Team:BGU_Israel/Description ">Description</a></li>
+
          <li><a href="https://2018.igem.org/Team:BGU_Israel/Design">Design</a></li>
+
            <li><a href="https://2018.igem.org/Team:BGU_Israel/Results">Results</a></li>
+
          <li><a href="https://2018.igem.org/Team:BGU_ISRAEL/Protocols">Protocols</a></li>
+
            <li><a href="https://2018.igem.org/Team:BGU_ISRAEL/Notebook">Notebook</a></li>
+
           
+
        </ul>
+
      </li>
+
          <li class="dropdown">
+
        <a class="dropdown-toggle" data-toggle="dropdown" href="https://2018.igem.org/Team:BGU_Israel/Description">Team
+
        </a>
+
        <ul class="dropdown-menu pull-right">
+
          <li><a href="https://2018.igem.org/Team:BGU_Israel/Team">Members</a></li>
+
          <li><a href="https://2018.igem.org/Team:BGU_Israel/Collaborations">Collaborations</a></li>
+
        </ul>
+
      </li>
+
          <li class="dropdown">
+
        <a class="dropdown-toggle" data-toggle="dropdown" href="https://2018.igem.org/Team:BGU_Israel/Description">Parts
+
        </a>
+
        <ul class="dropdown-menu pull-right">
+
          <li><a href="https://2018.igem.org/Team:BGU_Israel/Parts">Team Parts</a></li>
+
          <li><a href="https://2018.igem.org/Team:BGU_Israel/BasicParts ">Basic Parts</a></li>
+
            <li><a href="https://2018.igem.org/Team:BGU_Israel/PartImprovement">Part Improvement</a></li>
+
          <li><a href="https://2018.igem.org/Team:BGU_Israel/PartCollection">Part Collection</a></li>
+
        </ul>
+
      </li>
+
 
+
  <li class="dropdown">
+
        <a class="dropdown-toggle" data-toggle="dropdown" href="https://2018.igem.org/Team:BGU_Israel/Description">Practices
+
 
+
        </a>
+
        <ul class="dropdown-menu pull-right">
+
          <li><a href="https://2018.igem.org/Team:BGU_ISRAEL/ALSConference">ALS Conference</a></li>
+
          <li><a href="https://2018.igem.org/Team:BGU_ISRAEL/ALSFunding">Funding Race</a></li>
+
            <li><a href="https://2018.igem.org/Team:BGU_Israel/InterLab">InterLab</a></li>
+
          <li><a href="https://2018.igem.org/Team:BGU_ISRAEL/EthicsAndSafety">Ethics and Safty</a></li>
+
        </ul>
+
      </li>
+
        <li><a href="https://2018.igem.org/Team:BGU_ISRAEL/Attributions">Attributions</a></li>
+
          <!--<li><a href="https://2018.igem.org/Team:BGU_ISRAEL/Achievments">Achievments</a></li>-->
+
      </ul>
+
    </div>
+
  </div>
+
</nav>
+
  <header  class="sub-page-header text-center">
+
      <div class="container my-auto">
+
          <h1>Notebook</h1>
+
      </div>
+
    </header>
+
 
+
<!-- month1 -->
+
<div id="abstract" class="container-fluid text-center">
+
 
   <div class="row">
 
   <div class="row">
<h1>October</h1>
+
<h1>February</h1>
 
<div class="col-sm-8 col-sm-offset-2">
 
<div class="col-sm-8 col-sm-offset-2">
<p>In this example we have added a "plus" sign to each button. When the user clicks on the button, the "plus" sign is replaced with a "minus" sign.</p>
+
<p>We began working in our brand-new lab space! When we first arrived, the lab was nothing but two work benches. We had to collect and organize the equipment, materials, cell culture room, and work area; all according to lab safety standards.  We also began cloning the plasmids for our experiments and learning how to work with cell culture by practicing on HEK293 cells.<br/>
 +
<br/>
 +
<b>Highlights:</b> clone Steap4, Timp1, F4/80 into pGL4.17 and pGL3 plasmid for Promoter Assay.  
 +
</p>
 
<button class="accordion">Week 1</button>
 
<button class="accordion">Week 1</button>
 
<div class="panel2">
 
<div class="panel2">
<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.</p>
+
<object data="https://static.igem.org/mediawiki/2018/a/a6/T--BGU_Israel--notebook_week1.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/a/a6/T--BGU_Israel--notebook_week1.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 
</div>
 
</div>
  
<button class="accordion">Week 2</button>
+
<button class="accordion">Week 2 </button>
 
<div class="panel2">
 
<div class="panel2">
  <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.</p>
+
<object data="https://static.igem.org/mediawiki/2018/f/f6/T--BGU_Israel--notebook_week2.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/f/f6/T--BGU_Israel--notebook_week2.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 
</div>
 
</div>
  
<button class="accordion">Week 3</button>
+
<button class="accordion">Week 3 </button>
 
<div class="panel2">
 
<div class="panel2">
  <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.</p>
+
<object data="https://static.igem.org/mediawiki/2018/1/1a/T--BGU_Israel--notebook_week3.pdf" width="100%" height="500">
</div
+
                        <embed src="https://static.igem.org/mediawiki/2018/1/1a/T--BGU_Israel--notebook_week3.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
 +
 
 +
<button class="accordion">Week 4</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/3/36/T--BGU_Israel--notebook_week4.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/3/36/T--BGU_Israel--notebook_week4.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
 +
 
 
</div>
 
</div>
 
   </div>
 
   </div>
Line 460: Line 89:
 
</div>
 
</div>
  
<!-- month2 -->
+
<!-- March -->
<div id="abstract" class="container-fluid text-center" style="background-color:#ededed !important">
+
<div id="march" class="bg-grey text-center">
 
   <div class="row">
 
   <div class="row">
<h1>September</h1>
+
<h1>March</h1>
 
<div class="col-sm-8 col-sm-offset-2">
 
<div class="col-sm-8 col-sm-offset-2">
<p>In this example we have added a "plus" sign to each button. When the user clicks on the button, the "plus" sign is replaced with a "minus" sign.</p>
+
<p>
<button class="accordion">Week 1</button>
+
In March, we experienced our first little success. We cloned our promoters into the pGL3 vector and were able to begin our first experiment, the Promoter Assay. Meanwhile, so far, our practice cells were alive and well.
 +
<br/>
 +
<br/>
 +
<b>Highlights:</b> A decision was made to concentrate our efforts on the pGL3 plasmid expression assay. Because, then we could compare the expression among the promoters and we wouldn’t have to use two sets of luciferase kits.
 +
</p>
 +
<button class="accordion">Week 5</button>
 
<div class="panel2">
 
<div class="panel2">
<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.</p>
+
<object data="https://static.igem.org/mediawiki/2018/8/83/T--BGU_Israel--notebook_week5.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/8/83/T--BGU_Israel--notebook_week5.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 
</div>
 
</div>
  
<button class="accordion">Week 2</button>
+
<button class="accordion">Week 6</button>
 
<div class="panel2">
 
<div class="panel2">
  <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.</p>
+
<object data="https://static.igem.org/mediawiki/2018/1/10/T--BGU_Israel--notebook_week6.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/1/10/T--BGU_Israel--notebook_week6.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 
</div>
 
</div>
  
<button class="accordion">Week 3</button>
+
<button class="accordion">Week 7</button>
 
<div class="panel2">
 
<div class="panel2">
  <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.</p>
+
<object data="https://static.igem.org/mediawiki/2018/9/97/T--BGU_Israel--notebook_week7.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/9/97/T--BGU_Israel--notebook_week7.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 
</div>
 
</div>
 +
 +
<button class="accordion">Week 8</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/d/de/T--BGU_Israel--notebook_week8.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/d/de/T--BGU_Israel--notebook_week8.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
 +
 
</div>
 
</div>
 
   </div>
 
   </div>
 
</div>
 
</div>
  
<!-- testing -->
+
 
<div class="container">
+
<!-- April -->
 +
<div id="april" class="bg-white text-center">
 
   <div class="row">
 
   <div class="row">
    <nav class="col-sm-3" id="myScrollspy">
+
<h1>April</h1>
      <ul class="nav nav-pills nav-stacked">
+
<div class="col-sm-8 col-sm-offset-2">
        <li class="active"><a href="#section1">Section 1</a></li>
+
<p>
        <li><a href="#section2">Section 2</a></li>
+
Our long-awaited microglia and astrocytes arrived! While our cell lines were getting used to their new home, we began cloning our crisper and gRNA plasmids for our two-component system.
        <li><a href="#section3">Section 3</a></li>
+
<br/>
        <li class="dropdown">
+
<br/>
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">Section 4 <span class="caret"></span></a>
+
<b>Highlights:</b> Received microglia and astrocytes cell lines, px601, H1, H2 CMV-dCas9-VPR, building plasmids with Gibson assembly.
          <ul class="dropdown-menu">
+
</p>
            <li><a href="#section41">Section 4-1</a></li>
+
<button class="accordion">Week 9</button>
            <li><a href="#section42">Section 4-2</a></li>                   
+
<div class="panel2">
          </ul>
+
<object data="https://static.igem.org/mediawiki/2018/4/46/T--BGU_Israel--notebook_week9.pdf" width="100%" height="500">
        </li>
+
                        <embed src="https://static.igem.org/mediawiki/2018/4/46/T--BGU_Israel--notebook_week9.pdf" type="application/pdf" width="100%" height="600" />
      </ul>
+
</object>
    </nav>
+
    <div class="col-sm-9">
+
      <div id="section1">   
+
        <h1>Section 1</h1>
+
        <p>Try to scroll this section and look at the navigation list while scrolling!</p>
+
      </div>
+
      <div id="section2">
+
        <h1>Section 2</h1>
+
        <p>Try to scroll this section and look at the navigation list while scrolling!</p>
+
      </div>       
+
      <div id="section3">       
+
        <h1>Section 3</h1>
+
        <p>Try to scroll this section and look at the navigation list while scrolling!</p>
+
      </div>
+
      <div id="section41">       
+
        <h1>Section 4-1</h1>
+
        <p>Try to scroll this section and look at the navigation list while scrolling!</p>
+
      </div>     
+
      <div id="section42">       
+
        <h1>Section 4-2</h1>
+
        <p>Try to scroll this section and look at the navigation list while scrolling!</p>
+
      </div>
+
    </div>
+
  </div>
+
 
</div>
 
</div>
<!-- test end -->
 
  
 +
<button class="accordion">Week 10</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/e/ea/T--BGU_Israel--notebook_week10.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/e/ea/T--BGU_Israel--notebook_week10.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
 +
<button class="accordion">Week 11</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/7/78/T--BGU_Israel--notebook_week11.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/7/78/T--BGU_Israel--notebook_week11.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
<style>
+
<button class="accordion">Week 12</button>
    .footer-list {
+
<div class="panel2">
        list-style: none;
+
<object data="https://static.igem.org/mediawiki/2018/d/db/T--BGU_Israel--notebook_week12.pdf" width="100%" height="500">
        color:#fff;
+
                        <embed src="https://static.igem.org/mediawiki/2018/d/db/T--BGU_Israel--notebook_week12.pdf" type="application/pdf" width="100%" height="600" />
    }
+
</object>
    .footer-list-item {
+
</div>
        padding:20px 0 20px 0 !important;
+
        border-bottom: 1px solid #fff;
+
    }
+
    .footer-list .footer-list-item:last-child {
+
        border:0;
+
    }
+
    .container-fluid {
+
      padding: 60px 50px;
+
  }
+
  
    .bg-grey {
+
</div>
        background-color:#ededed;
+
  </div>
        color:#000;
+
</div>
        padding: 60px 50px;
+
    }
+
    .bg-white {
+
        background-color:#fff;
+
        color:#000;
+
        padding: 60px 50px;
+
    }
+
    .bg-dark {
+
        background-color:#262626;
+
       
+
        padding: 60px 50px;
+
    }
+
      .bg-dark h1 {
+
        color:#fff !important;
+
       
+
    }
+
    footer.bg-dark p {
+
        color:#ededed !important;
+
    }
+
    .social-icons {
+
        display: inline;
+
        height:20px;
+
        width:20px;
+
        margin-right:10px;
+
    }
+
  
</style>
 
  
<footer class="bg-dark">
+
<!-- May -->
    <div class="container my-auto">
+
<div id="may" class="bg-grey text-center">
<div class="row">
+
  <div class="row">
    <div class="col-md-4">
+
<h1>May</h1>
        <h3>About OrignALS</h3>
+
<div class="col-sm-8 col-sm-offset-2">
        <p><br>Established in 2006, EchoSense Ltd. develops innovative ultrasound Doppler systems for the diagnosis and monitoring of cardiac and pulmonary diseases. EchoSense delivers a fast,reliable and non-invasive method of diagnosis and our technology has undergone successful clinical trials in the United States, Europe and Israel. The Echosense research and development center is based in Haifa, Israel.</p>
+
<p>
        <img class="responsive-img" src="https://static.igem.org/mediawiki/2018/f/f0/T--BGU_Israel--originals_white.png" width="50%">
+
After a tireless journey, we successfully cloned most of our system’s plasmids. Now we began attempts to transfect these plasmids into our cell lines with different transfection reagents. Additionally, we began the promoter assay and astrocyte reactivity assay.
       
+
<br/>
        <img class="img-responsive" src="">
+
<br/>
    </div>
+
<b>Highlights:</b> Began Promoter assay, transfection attempts with reagents, ELISA for astrocyte reactivity assay.
    <div class="col-md-4">
+
</p>
    <ul class="footer-list">
+
<button class="accordion">Week 13</button>
        <h3>Keep in Touch</h3>
+
<div class="panel2">
       
+
<object data="https://static.igem.org/mediawiki/2018/3/34/T--BGU_Israel--notebook_week13.pdf" width="100%" height="500">
  <li class="footer-list-item"><img class="img-responsive social-icons" src="https://static.igem.org/mediawiki/2018/3/3c/T--BGU_Israel--facebook.png" > @iGEMBGU</li>
+
                        <embed src="https://static.igem.org/mediawiki/2018/3/34/T--BGU_Israel--notebook_week13.pdf" type="application/pdf" width="100%" height="600" />
  <li class="footer-list-item"><img class="img-responsive social-icons" src="https://static.igem.org/mediawiki/2018/e/e9/T--BGU_Israel--instagram.png" >@igem_2018_bgu</li>
+
</object>
  <li class="footer-list-item"><img class="img-responsive social-icons" src="https://static.igem.org/mediawiki/2018/2/26/T--BGU_Israel--twitter.jpg" > @originalsbgu</li>
+
        <li class="footer-list-item"><img class="img-responsive social-icons" src="https://static.igem.org/mediawiki/2018/8/83/T--BGU_Israel--email.png" > bgu_israel@gmail.com</li>
+
</ul>
+
    </div>
+
    <div class="col-md-4">
+
    <ul class="footer-list">
+
        <h3>Address</h3>
+
  <li class="footer-list-item">Ben-Gurion University of the Negev<br>
+
Ben Gurion 1, Beer Sheva 8410501, Israel</li>
+
 
+
          <li class="footer-list-item"><img class="responsive-img" src="https://static.igem.org/mediawiki/2018/a/a5/T--BGU_Israel--bgu_white.png"></li>
+
</ul>
+
    </div>
+
   
+
 
</div>
 
</div>
        </div>
 
</footer>
 
  
<script>
+
<button class="accordion">Week 14</button>
$(document).ready(function(){
+
<div class="panel2">
  // Add smooth scrolling to all links in navbar + footer link
+
<object data="https://static.igem.org/mediawiki/2018/7/7d/T--BGU_Israel--notebook_week14.pdf" width="100%" height="500">
  $(".navbar a, #myBtn[href='#top']").on('click', function(event) {
+
                        <embed src="https://static.igem.org/mediawiki/2018/7/7d/T--BGU_Israel--notebook_week14.pdf" type="application/pdf" width="100%" height="600" />
    // Make sure this.hash has a value before overriding default behavior
+
</object>
    if (this.hash !== "") {
+
</div>
      // Prevent default anchor click behavior
+
      event.preventDefault();
+
  
      // Store hash
+
<button class="accordion">Week 15</button>
      var hash = this.hash;
+
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/0/0c/T--BGU_Israel--notebook_week15.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/0/0c/T--BGU_Israel--notebook_week15.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
      // Using jQuery's animate() method to add smooth page scroll
+
<button class="accordion">Week 16</button>
      // The optional number (900) specifies the number of milliseconds it takes to scroll to the specified area
+
<div class="panel2">
      $('html, body').animate({
+
<object data="https://static.igem.org/mediawiki/2018/2/2d/T--BGU_Israel--notebook_week16.pdf" width="100%" height="500">
        scrollTop: $(hash).offset().top
+
                        <embed src="https://static.igem.org/mediawiki/2018/2/2d/T--BGU_Israel--notebook_week16.pdf" type="application/pdf" width="100%" height="600" />
      }, 500, function(){
+
</object>
 
+
</div>
        // Add hash (#) to URL when done scrolling (default click behavior)
+
        window.location.hash = hash;
+
      });
+
    } // End if
+
  });
+
 
+
  $(window).scroll(function() {
+
    $(".slideanim").each(function(){
+
      var pos = $(this).offset().top;
+
  
      var winTop = $(window).scrollTop();
+
</div>
        if (pos < winTop + 600) {
+
   </div>
          $(this).addClass("slide");
+
</div>
        }
+
    });
+
   });
+
})
+
</script>
+
<script type="text/javascript">
+
    /*!
+
* parallax.js v1.5.0 (http://pixelcog.github.io/parallax.js/)
+
* @copyright 2016 PixelCog, Inc.
+
* @license MIT (https://github.com/pixelcog/parallax.js/blob/master/LICENSE)
+
*/
+
  
;(function ( $, window, document, undefined ) {
 
  
   // Polyfill for requestAnimationFrame
+
<!-- June -->
  // via: https://gist.github.com/paulirish/1579671
+
<div id="june" class="bg-white text-center">
 +
   <div class="row">
 +
<h1>June</h1>
 +
<div class="col-sm-8 col-sm-offset-2">
 +
<p>
 +
In June we had to face the music; our transfection was not working. We began exploring alternatives ways to insert our plasmids into our cells, such as electroporation, calcium phosphate transfection, and additional transfection reagents.
 +
<br/>
 +
<br/>
 +
<b>Highlights:</b> Astrocyte Western blot, Electroporation of microglia.
 +
</p>
 +
<button class="accordion">Week 17</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/6/6e/T--BGU_Israel--notebook_week17.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/6/6e/T--BGU_Israel--notebook_week17.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
  (function() {
+
<button class="accordion">Week 18</button>
    var lastTime = 0;
+
<div class="panel2">
    var vendors = ['ms', 'moz', 'webkit', 'o'];
+
<object data="https://static.igem.org/mediawiki/2018/7/7c/T--BGU_Israel--notebook_week18.pdf" width="100%" height="500">
    for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
+
                        <embed src="https://static.igem.org/mediawiki/2018/7/7c/T--BGU_Israel--notebook_week18.pdf" type="application/pdf" width="100%" height="600" />
      window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
+
</object>
      window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelRequestAnimationFrame'];
+
</div>
    }
+
  
    if (!window.requestAnimationFrame)
+
<button class="accordion">Week 19</button>
      window.requestAnimationFrame = function(callback) {
+
<div class="panel2">
        var currTime = new Date().getTime();
+
<object data="https://static.igem.org/mediawiki/2018/2/22/T--BGU_Israel--notebook_week19.pdf" width="100%" height="500">
        var timeToCall = Math.max(0, 16 - (currTime - lastTime));
+
                        <embed src="https://static.igem.org/mediawiki/2018/2/22/T--BGU_Israel--notebook_week19.pdf" type="application/pdf" width="100%" height="600" />
        var id = window.setTimeout(function() { callback(currTime + timeToCall); },
+
</object>
          timeToCall);
+
</div>
        lastTime = currTime + timeToCall;
+
        return id;
+
      };
+
  
    if (!window.cancelAnimationFrame)
+
<button class="accordion">Week 20</button>
      window.cancelAnimationFrame = function(id) {
+
<div class="panel2">
        clearTimeout(id);
+
<object data="https://static.igem.org/mediawiki/2018/7/79/T--BGU_Israel--notebook_week20.pdf" width="100%" height="500">
      };
+
                        <embed src="https://static.igem.org/mediawiki/2018/7/79/T--BGU_Israel--notebook_week20.pdf" type="application/pdf" width="100%" height="600" />
  }());
+
</object>
 +
</div>
  
 +
</div>
 +
  </div>
 +
</div>
  
  // Parallax Constructor
 
  
   function Parallax(element, options) {
+
<!-- July -->
    var self = this;
+
<div id="july" class="bg-grey text-center">
 +
   <div class="row">
 +
<h1>July</h1>
 +
<div class="col-sm-8 col-sm-offset-2">
 +
<p>
 +
In July we preformed further attempts to transfect our cells and reactivity assays, and let’s not forget exams period.
 +
<br/>
 +
<br/>
 +
<b>Highlights:</b> Electroporation of microglia, mycoplasma assay, colony PCR after the microglia electroporation, transfection attempts with reagents, astrocyte reactivity assay using western blot.
 +
</p>
 +
<button class="accordion">Week 21</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/4/47/T--BGU_Israel--notebook_week21.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/4/47/T--BGU_Israel--notebook_week21.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
    if (typeof options == 'object') {
+
<button class="accordion">Week 22</button>
      delete options.refresh;
+
<div class="panel2">
      delete options.render;
+
<object data="https://static.igem.org/mediawiki/2018/d/db/T--BGU_Israel--notebook_week22.pdf" width="100%" height="500">
      $.extend(this, options);
+
                        <embed src="https://static.igem.org/mediawiki/2018/d/db/T--BGU_Israel--notebook_week22.pdf" type="application/pdf" width="100%" height="600" />
    }
+
</object>
 +
</div>
  
    this.$element = $(element);
+
<button class="accordion">Week 23</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/8/89/T--BGU_Israel--notebook_week23.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/8/89/T--BGU_Israel--notebook_week23.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
    if (!this.imageSrc && this.$element.is('img')) {
+
<button class="accordion">Week 24</button>
      this.imageSrc = this.$element.attr('src');
+
<div class="panel2">
    }
+
<object data="https://static.igem.org/mediawiki/2018/f/f1/T--BGU_Israel--notebook_week24.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/f/f1/T--BGU_Israel--notebook_week24.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
    var positions = (this.position + '').toLowerCase().match(/\S+/g) || [];
+
</div>
 +
  </div>
 +
</div>
  
    if (positions.length < 1) {
+
<!-- August -->
      positions.push('center');
+
<div id="august" class="bg-white text-center">
    }
+
  <div class="row">
    if (positions.length == 1) {
+
<h1>August</h1>
      positions.push(positions[0]);
+
<div class="col-sm-8 col-sm-offset-2">
    }
+
<p>
 +
The summer was in full swing and with it our iGEM team. Each team member worked full force on experiments to reach a proof of concept.
 +
<br/>
 +
<br/>
 +
<b>Highlights:</b> continued reactive astrocyte experiments.
 +
</p>
 +
<button class="accordion">Week 25</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/0/0b/T--BGU_Israel--notebook_week25.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/0/0b/T--BGU_Israel--notebook_week25.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
    if (positions[0] == 'top' || positions[0] == 'bottom' || positions[1] == 'left' || positions[1] == 'right') {
 
      positions = [positions[1], positions[0]];
 
    }
 
  
    if (this.positionX !== undefined) positions[0] = this.positionX.toLowerCase();
+
</div>
    if (this.positionY !== undefined) positions[1] = this.positionY.toLowerCase();
+
  </div>
 +
</div>
  
    self.positionX = positions[0];
+
<!-- Experiments -->
    self.positionY = positions[1];
+
<div id="experiments" class="bg-grey text-center">
 +
  <div class="row">
 +
<h1>Experiments</h1>
 +
<div class="col-sm-8 col-sm-offset-2">
 +
<button class="accordion">Calcium Phosphate Transfection</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/3/34/T--BGU_Israel--notebook_exp_calcium_phosphate.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/3/34/T--BGU_Israel--notebook_exp_calcium_phosphate.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
    if (this.positionX != 'left' && this.positionX != 'right') {
+
<button class="accordion">Cytokine Inhibition</button>
      if (isNaN(parseInt(this.positionX))) {
+
<div class="panel2">
        this.positionX = 'center';
+
<object data="https://static.igem.org/mediawiki/2018/d/da/T--BGU_Israel--notebook_exp_qpcr.pdf" width="100%" height="500">
      } else {
+
                        <embed src="https://static.igem.org/mediawiki/2018/d/da/T--BGU_Israel--notebook_exp_qpcr.pdf" type="application/pdf" width="100%" height="600" />
        this.positionX = parseInt(this.positionX);
+
</object>
      }
+
</div>
    }
+
  
    if (this.positionY != 'top' && this.positionY != 'bottom') {
+
<button class="accordion">Cell lines Infections with Lentivirus</button>
      if (isNaN(parseInt(this.positionY))) {
+
<div class="panel2">
        this.positionY = 'center';
+
<object data="https://static.igem.org/mediawiki/2018/0/0e/T--BGU_Israel--notebook_exp_lenti_infection.pdf" width="100%" height="500">
      } else {
+
                        <embed src="https://static.igem.org/mediawiki/2018/0/0e/T--BGU_Israel--notebook_exp_lenti_infection.pdf" type="application/pdf" width="100%" height="600" />
        this.positionY = parseInt(this.positionY);
+
</object>
      }
+
</div>
    }
+
  
    this.position =
+
<button class="accordion">Promoter Assay</button>
      this.positionX + (isNaN(this.positionX)? '' : 'px') + ' ' +
+
<div class="panel2">
      this.positionY + (isNaN(this.positionY)? '' : 'px');
+
<object data="https://static.igem.org/mediawiki/2018/5/51/T--BGU_Israel--notebook_exp_promoter_assay.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/5/51/T--BGU_Israel--notebook_exp_promoter_assay.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
    if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
+
<button class="accordion">Reversed-Caspase-3 Induction</button>
      if (this.imageSrc && this.iosFix && !this.$element.is('img')) {
+
<div class="panel2">
        this.$element.css({
+
<object data="https://static.igem.org/mediawiki/2018/5/50/T--BGU_Israel--notebook_exp_caspase3.pdf" width="100%" height="500">
          backgroundImage: 'url(' + this.imageSrc + ')',
+
                        <embed src="https://static.igem.org/mediawiki/2018/5/50/T--BGU_Israel--notebook_exp_caspase3.pdf" type="application/pdf" width="100%" height="600" />
          backgroundSize: 'cover',
+
</object>
          backgroundPosition: this.position
+
</div>
        });
+
      }
+
      return this;
+
    }
+
  
    if (navigator.userAgent.match(/(Android)/)) {
+
</div>
      if (this.imageSrc && this.androidFix && !this.$element.is('img')) {
+
  </div>
        this.$element.css({
+
</div>
          backgroundImage: 'url(' + this.imageSrc + ')',
+
          backgroundSize: 'cover',
+
          backgroundPosition: this.position
+
        });
+
      }
+
      return this;
+
    }
+
  
    this.$mirror = $('<div />').prependTo(this.mirrorContainer);
 
  
    var slider = this.$element.find('>.parallax-slider');
 
    var sliderExisted = false;
 
  
    if (slider.length == 0)
 
      this.$slider = $('<img />').prependTo(this.$mirror);
 
    else {
 
      this.$slider = slider.prependTo(this.$mirror)
 
      sliderExisted = true;
 
    }
 
  
    this.$mirror.addClass('parallax-mirror').css({
+
   <!-- accordion script -->
      visibility: 'hidden',
+
      zIndex: this.zIndex,
+
      position: 'fixed',
+
      top: 0,
+
      left: 0,
+
      overflow: 'hidden'
+
    });
+
 
+
    this.$slider.addClass('parallax-slider').one('load', function() {
+
      if (!self.naturalHeight || !self.naturalWidth) {
+
        self.naturalHeight = this.naturalHeight || this.height || 1;
+
        self.naturalWidth  = this.naturalWidth  || this.width  || 1;
+
      }
+
      self.aspectRatio = self.naturalWidth / self.naturalHeight;
+
 
+
      Parallax.isSetup || Parallax.setup();
+
      Parallax.sliders.push(self);
+
      Parallax.isFresh = false;
+
      Parallax.requestRender();
+
    });
+
 
+
    if (!sliderExisted)
+
      this.$slider[0].src = this.imageSrc;
+
 
+
    if (this.naturalHeight && this.naturalWidth || this.$slider[0].complete || slider.length > 0) {
+
      this.$slider.trigger('load');
+
    }
+
 
+
   }
+
 
+
 
+
  // Parallax Instance Methods
+
 
+
  $.extend(Parallax.prototype, {
+
    speed:    0.2,
+
    bleed:    0,
+
    zIndex:  -100,
+
    iosFix:  true,
+
    androidFix: true,
+
    position: 'center',
+
    overScrollFix: false,
+
    mirrorContainer: 'body',
+
 
+
    refresh: function() {
+
      this.boxWidth        = this.$element.outerWidth();
+
      this.boxHeight      = this.$element.outerHeight() + this.bleed * 2;
+
      this.boxOffsetTop    = this.$element.offset().top - this.bleed;
+
      this.boxOffsetLeft  = this.$element.offset().left;
+
      this.boxOffsetBottom = this.boxOffsetTop + this.boxHeight;
+
 
+
      var winHeight = Parallax.winHeight;
+
      var docHeight = Parallax.docHeight;
+
      var maxOffset = Math.min(this.boxOffsetTop, docHeight - winHeight);
+
      var minOffset = Math.max(this.boxOffsetTop + this.boxHeight - winHeight, 0);
+
      var imageHeightMin = this.boxHeight + (maxOffset - minOffset) * (1 - this.speed) | 0;
+
      var imageOffsetMin = (this.boxOffsetTop - maxOffset) * (1 - this.speed) | 0;
+
      var margin;
+
 
+
      if (imageHeightMin * this.aspectRatio >= this.boxWidth) {
+
        this.imageWidth    = imageHeightMin * this.aspectRatio | 0;
+
        this.imageHeight  = imageHeightMin;
+
        this.offsetBaseTop = imageOffsetMin;
+
 
+
        margin = this.imageWidth - this.boxWidth;
+
 
+
        if (this.positionX == 'left') {
+
          this.offsetLeft = 0;
+
        } else if (this.positionX == 'right') {
+
          this.offsetLeft = - margin;
+
        } else if (!isNaN(this.positionX)) {
+
          this.offsetLeft = Math.max(this.positionX, - margin);
+
        } else {
+
          this.offsetLeft = - margin / 2 | 0;
+
        }
+
      } else {
+
        this.imageWidth    = this.boxWidth;
+
        this.imageHeight  = this.boxWidth / this.aspectRatio | 0;
+
        this.offsetLeft    = 0;
+
 
+
        margin = this.imageHeight - imageHeightMin;
+
 
+
        if (this.positionY == 'top') {
+
          this.offsetBaseTop = imageOffsetMin;
+
        } else if (this.positionY == 'bottom') {
+
          this.offsetBaseTop = imageOffsetMin - margin;
+
        } else if (!isNaN(this.positionY)) {
+
          this.offsetBaseTop = imageOffsetMin + Math.max(this.positionY, - margin);
+
        } else {
+
          this.offsetBaseTop = imageOffsetMin - margin / 2 | 0;
+
        }
+
      }
+
    },
+
 
+
    render: function() {
+
      var scrollTop    = Parallax.scrollTop;
+
      var scrollLeft  = Parallax.scrollLeft;
+
      var overScroll  = this.overScrollFix ? Parallax.overScroll : 0;
+
      var scrollBottom = scrollTop + Parallax.winHeight;
+
 
+
      if (this.boxOffsetBottom > scrollTop && this.boxOffsetTop <= scrollBottom) {
+
        this.visibility = 'visible';
+
        this.mirrorTop = this.boxOffsetTop  - scrollTop;
+
        this.mirrorLeft = this.boxOffsetLeft - scrollLeft;
+
        this.offsetTop = this.offsetBaseTop - this.mirrorTop * (1 - this.speed);
+
      } else {
+
        this.visibility = 'hidden';
+
      }
+
 
+
      this.$mirror.css({
+
        transform: 'translate3d('+this.mirrorLeft+'px, '+(this.mirrorTop - overScroll)+'px, 0px)',
+
        visibility: this.visibility,
+
        height: this.boxHeight,
+
        width: this.boxWidth
+
      });
+
 
+
      this.$slider.css({
+
        transform: 'translate3d('+this.offsetLeft+'px, '+this.offsetTop+'px, 0px)',
+
        position: 'absolute',
+
        height: this.imageHeight,
+
        width: this.imageWidth,
+
        maxWidth: 'none'
+
      });
+
    }
+
  });
+
 
+
 
+
  // Parallax Static Methods
+
 
+
  $.extend(Parallax, {
+
    scrollTop:    0,
+
    scrollLeft:  0,
+
    winHeight:    0,
+
    winWidth:    0,
+
    docHeight:    1 << 30,
+
    docWidth:    1 << 30,
+
    sliders:      [],
+
    isReady:      false,
+
    isFresh:      false,
+
    isBusy:      false,
+
 
+
    setup: function() {
+
      if (this.isReady) return;
+
 
+
      var self = this;
+
 
+
      var $doc = $(document), $win = $(window);
+
 
+
      var loadDimensions = function() {
+
        Parallax.winHeight = $win.height();
+
        Parallax.winWidth  = $win.width();
+
        Parallax.docHeight = $doc.height();
+
        Parallax.docWidth  = $doc.width();
+
      };
+
 
+
      var loadScrollPosition = function() {
+
        var winScrollTop  = $win.scrollTop();
+
        var scrollTopMax  = Parallax.docHeight - Parallax.winHeight;
+
        var scrollLeftMax = Parallax.docWidth  - Parallax.winWidth;
+
        Parallax.scrollTop  = Math.max(0, Math.min(scrollTopMax,  winScrollTop));
+
        Parallax.scrollLeft = Math.max(0, Math.min(scrollLeftMax, $win.scrollLeft()));
+
        Parallax.overScroll = Math.max(winScrollTop - scrollTopMax, Math.min(winScrollTop, 0));
+
      };
+
 
+
      $win.on('resize.px.parallax load.px.parallax', function() {
+
          loadDimensions();
+
          self.refresh();
+
          Parallax.isFresh = false;
+
          Parallax.requestRender();
+
        })
+
        .on('scroll.px.parallax load.px.parallax', function() {
+
          loadScrollPosition();
+
          Parallax.requestRender();
+
        });
+
 
+
      loadDimensions();
+
      loadScrollPosition();
+
 
+
      this.isReady = true;
+
 
+
      var lastPosition = -1;
+
 
+
      function frameLoop() {
+
        if (lastPosition == window.pageYOffset) {  // Avoid overcalculations
+
          window.requestAnimationFrame(frameLoop);
+
          return false;
+
        } else lastPosition = window.pageYOffset;
+
 
+
        self.render();
+
        window.requestAnimationFrame(frameLoop);
+
      }
+
 
+
      frameLoop();
+
    },
+
 
+
    configure: function(options) {
+
      if (typeof options == 'object') {
+
        delete options.refresh;
+
        delete options.render;
+
        $.extend(this.prototype, options);
+
      }
+
    },
+
 
+
    refresh: function() {
+
      $.each(this.sliders, function(){ this.refresh(); });
+
      this.isFresh = true;
+
    },
+
 
+
    render: function() {
+
      this.isFresh || this.refresh();
+
      $.each(this.sliders, function(){ this.render(); });
+
    },
+
 
+
    requestRender: function() {
+
      var self = this;
+
      self.render();
+
      self.isBusy = false;
+
    },
+
    destroy: function(el){
+
      var i,
+
          parallaxElement = $(el).data('px.parallax');
+
      parallaxElement.$mirror.remove();
+
      for(i=0; i < this.sliders.length; i+=1){
+
        if(this.sliders[i] == parallaxElement){
+
          this.sliders.splice(i, 1);
+
        }
+
      }
+
      $(el).data('px.parallax', false);
+
      if(this.sliders.length === 0){
+
        $(window).off('scroll.px.parallax resize.px.parallax load.px.parallax');
+
        this.isReady = false;
+
        Parallax.isSetup = false;
+
      }
+
    }
+
  });
+
 
+
 
+
  // Parallax Plugin Definition
+
 
+
  function Plugin(option) {
+
    return this.each(function () {
+
      var $this = $(this);
+
      var options = typeof option == 'object' && option;
+
 
+
      if (this == window || this == document || $this.is('body')) {
+
        Parallax.configure(options);
+
      }
+
      else if (!$this.data('px.parallax')) {
+
        options = $.extend({}, $this.data(), options);
+
        $this.data('px.parallax', new Parallax(this, options));
+
      }
+
      else if (typeof option == 'object')
+
      {
+
        $.extend($this.data('px.parallax'), options);
+
      }
+
      if (typeof option == 'string') {
+
        if(option == 'destroy'){
+
            Parallax.destroy(this);
+
        }else{
+
          Parallax[option]();
+
        }
+
      }
+
    });
+
  }
+
 
+
  var old = $.fn.parallax;
+
 
+
  $.fn.parallax            = Plugin;
+
  $.fn.parallax.Constructor = Parallax;
+
 
+
 
+
  // Parallax No Conflict
+
 
+
  $.fn.parallax.noConflict = function () {
+
    $.fn.parallax = old;
+
    return this;
+
  };
+
 
+
 
+
  // Parallax Data-API
+
 
+
  $( function () {
+
    $('[data-parallax="scroll"]').parallax();
+
  });
+
 
+
}(jQuery, window, document));
+
 
+
    </script>
+
    <script>
+
// When the user scrolls down 20px from the top of the document, show the button
+
$(window).scroll(function() {
+
    if ($(this).scrollTop() > 20) {
+
        $('#myBtn').fadeIn(400);
+
    } else {
+
        $('#myBtn').fadeOut(400);
+
    }
+
});
+
 
+
</script>
+
 
+
 
+
<!-- accordion script -->
+
 
<script>
 
<script>
 
var acc = document.getElementsByClassName("accordion");
 
var acc = document.getElementsByClassName("accordion");
Line 1,090: Line 394:
 
   });
 
   });
 
}
 
}
 +
$('.btn-info').click(function(){
 +
    $('html, body').animate({
 +
        scrollTop: $( $(this).attr('href') ).offset().top
 +
    }, 500);
 +
    return false;
 +
});
 
</script>
 
</script>
 
<!-- accordion script end -->
 
<!-- accordion script end -->
 
</body>
 
</body>
 
</html>
 
</html>
 +
{{Template:BGU_Israel/footer}}

Latest revision as of 16:34, 17 October 2018

OriginALS

OriginALS

Notebook

February

We began working in our brand-new lab space! When we first arrived, the lab was nothing but two work benches. We had to collect and organize the equipment, materials, cell culture room, and work area; all according to lab safety standards. We also began cloning the plasmids for our experiments and learning how to work with cell culture by practicing on HEK293 cells.

Highlights: clone Steap4, Timp1, F4/80 into pGL4.17 and pGL3 plasmid for Promoter Assay.

March

In March, we experienced our first little success. We cloned our promoters into the pGL3 vector and were able to begin our first experiment, the Promoter Assay. Meanwhile, so far, our practice cells were alive and well.

Highlights: A decision was made to concentrate our efforts on the pGL3 plasmid expression assay. Because, then we could compare the expression among the promoters and we wouldn’t have to use two sets of luciferase kits.

April

Our long-awaited microglia and astrocytes arrived! While our cell lines were getting used to their new home, we began cloning our crisper and gRNA plasmids for our two-component system.

Highlights: Received microglia and astrocytes cell lines, px601, H1, H2 CMV-dCas9-VPR, building plasmids with Gibson assembly.

May

After a tireless journey, we successfully cloned most of our system’s plasmids. Now we began attempts to transfect these plasmids into our cell lines with different transfection reagents. Additionally, we began the promoter assay and astrocyte reactivity assay.

Highlights: Began Promoter assay, transfection attempts with reagents, ELISA for astrocyte reactivity assay.

June

In June we had to face the music; our transfection was not working. We began exploring alternatives ways to insert our plasmids into our cells, such as electroporation, calcium phosphate transfection, and additional transfection reagents.

Highlights: Astrocyte Western blot, Electroporation of microglia.

July

In July we preformed further attempts to transfect our cells and reactivity assays, and let’s not forget exams period.

Highlights: Electroporation of microglia, mycoplasma assay, colony PCR after the microglia electroporation, transfection attempts with reagents, astrocyte reactivity assay using western blot.

August

The summer was in full swing and with it our iGEM team. Each team member worked full force on experiments to reach a proof of concept.

Highlights: continued reactive astrocyte experiments.

Experiments

OriginALS

About Us


The BGU-iGEM team “OriginALS” hopes to develop an innovative therapeutic approach to prolong the life expectancy of ALS patients, using Synthetic Biology. We are dedicated to promoting ALS awareness and research in Israel through public engagement and educational activities.