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

 
(90 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;
+
}
+
 
+
 
+
.sidenav {
+
    width: 130px;
+
    position: fixed;
+
    z-index: 1;
+
    top: 20px;
+
    left: 10px;
+
    background: #eee;
+
    overflow-x: hidden;
+
    padding: 8px 0;
+
}
+
 
+
.sidenav a {
+
    padding: 6px 8px 6px 16px;
+
    text-decoration: none;
+
    font-size: 25px;
+
    color: #2196F3;
+
    display: block;
+
}
+
 
+
.sidenav a:hover {
+
    color: #064579;
+
}
+
 
+
 
+
@media screen and (max-height: 450px) {
+
    .sidenav {padding-top: 15px;}
+
    .sidenav a {font-size: 18px;}
+
}
+
 
+
 
+
    </style>
+
</head>
+
<body id="myPage"  data-spy="scroll" data-target=".navbar #myScrollspy" 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">
 
      <ul class="nav navbar-nav navbar-right">
 
        <li><a href="index.html">Home</a></li>
 
        <li class="dropdown">
 
        <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>
 
 
<div class="sidenav">
 
  <a href="#about">About</a>
 
  <a href="#services">Services</a>
 
  <a href="#clients">Clients</a>
 
  <a href="#contact">Contact</a>
 
 
</div>
 
</div>
 
+
<div class="arrowdown "></div>
<!-- month1 -->
+
<!-- February -->
<div id="abstract" class="container-fluid text-center">
+
<div id="february" class="bg-white 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 474: 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>
  
<style>
 
    .footer-list {
 
        list-style: none;
 
        color:#fff;
 
    }
 
    .footer-list-item {
 
        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 {
+
<!-- April -->
        background-color:#ededed;
+
<div id="april" class="bg-white text-center">
        color:#000;
+
  <div class="row">
        padding: 60px 50px;
+
<h1>April</h1>
    }
+
<div class="col-sm-8 col-sm-offset-2">
    .bg-white {
+
<p>
        background-color:#fff;
+
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.
        color:#000;
+
<br/>
        padding: 60px 50px;
+
<br/>
    }
+
<b>Highlights:</b> Received microglia and astrocytes cell lines, px601, H1, H2 CMV-dCas9-VPR, building plasmids with Gibson assembly.
    .bg-dark {
+
</p>
        background-color:#262626;
+
<button class="accordion">Week 9</button>
       
+
<div class="panel2">
        padding: 60px 50px;
+
<object data="https://static.igem.org/mediawiki/2018/4/46/T--BGU_Israel--notebook_week9.pdf" width="100%" height="500">
    }
+
                        <embed src="https://static.igem.org/mediawiki/2018/4/46/T--BGU_Israel--notebook_week9.pdf" type="application/pdf" width="100%" height="600" />
      .bg-dark h1 {
+
</object>
        color:#fff !important;
+
</div>
       
+
    }
+
    footer.bg-dark p {
+
        color:#ededed !important;
+
    }
+
    .social-icons {
+
        display: inline;
+
        height:20px;
+
        width:20px;
+
        margin-right:10px;
+
    }
+
  
</style>
+
<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>
  
<footer class="bg-dark">
+
<button class="accordion">Week 11</button>
    <div  class="container my-auto">
+
<div class="panel2">
<div class="row">
+
<object data="https://static.igem.org/mediawiki/2018/7/78/T--BGU_Israel--notebook_week11.pdf" width="100%" height="500">
    <div class="col-md-4">
+
                        <embed src="https://static.igem.org/mediawiki/2018/7/78/T--BGU_Israel--notebook_week11.pdf" type="application/pdf" width="100%" height="600" />
        <h3>About OrignALS</h3>
+
</object>
        <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>
+
        <img class="responsive-img" src="https://static.igem.org/mediawiki/2018/f/f0/T--BGU_Israel--originals_white.png" width="50%">
+
       
+
        <img class="img-responsive" src="">
+
    </div>
+
    <div class="col-md-4">
+
    <ul class="footer-list">
+
        <h3>Keep in Touch</h3>
+
       
+
  <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>
+
  <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>
+
  <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 12</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/d/db/T--BGU_Israel--notebook_week12.pdf" width="100%" height="500">
  $(".navbar a, #myBtn[href='#top']").on('click', function(event) {
+
                        <embed src="https://static.igem.org/mediawiki/2018/d/db/T--BGU_Israel--notebook_week12.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
+
</div>
      var hash = this.hash;
+
  </div>
 +
</div>
  
      // Using jQuery's animate() method to add smooth page scroll
 
      // The optional number (900) specifies the number of milliseconds it takes to scroll to the specified area
 
      $('html, body').animate({
 
        scrollTop: $(hash).offset().top
 
      }, 500, function(){
 
 
 
        // 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();
+
<!-- May -->
        if (pos < winTop + 600) {
+
<div id="may" class="bg-grey text-center">
          $(this).addClass("slide");
+
  <div class="row">
        }
+
<h1>May</h1>
    });
+
<div class="col-sm-8 col-sm-offset-2">
  });
+
<p>
})
+
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.
</script>
+
<br/>
<script type="text/javascript">
+
<br/>
    /*!
+
<b>Highlights:</b> Began Promoter assay, transfection attempts with reagents, ELISA for astrocyte reactivity assay.
* parallax.js v1.5.0 (http://pixelcog.github.io/parallax.js/)
+
</p>
* @copyright 2016 PixelCog, Inc.
+
<button class="accordion">Week 13</button>
* @license MIT (https://github.com/pixelcog/parallax.js/blob/master/LICENSE)
+
<div class="panel2">
*/
+
<object data="https://static.igem.org/mediawiki/2018/3/34/T--BGU_Israel--notebook_week13.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/3/34/T--BGU_Israel--notebook_week13.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
;(function ( $, window, document, undefined ) {
+
<button class="accordion">Week 14</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/7/7d/T--BGU_Israel--notebook_week14.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/7/7d/T--BGU_Israel--notebook_week14.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
  // Polyfill for requestAnimationFrame
+
<button class="accordion">Week 15</button>
  // via: https://gist.github.com/paulirish/1579671
+
<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>
  
  (function() {
+
<button class="accordion">Week 16</button>
    var lastTime = 0;
+
<div class="panel2">
    var vendors = ['ms', 'moz', 'webkit', 'o'];
+
<object data="https://static.igem.org/mediawiki/2018/2/2d/T--BGU_Israel--notebook_week16.pdf" width="100%" height="500">
    for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
+
                        <embed src="https://static.igem.org/mediawiki/2018/2/2d/T--BGU_Israel--notebook_week16.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)
+
</div>
      window.requestAnimationFrame = function(callback) {
+
  </div>
        var currTime = new Date().getTime();
+
</div>
        var timeToCall = Math.max(0, 16 - (currTime - lastTime));
+
        var id = window.setTimeout(function() { callback(currTime + timeToCall); },
+
          timeToCall);
+
        lastTime = currTime + timeToCall;
+
        return id;
+
      };
+
  
    if (!window.cancelAnimationFrame)
 
      window.cancelAnimationFrame = function(id) {
 
        clearTimeout(id);
 
      };
 
  }());
 
  
 +
<!-- June -->
 +
<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>
  
  // Parallax Constructor
+
<button class="accordion">Week 18</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/7/7c/T--BGU_Israel--notebook_week18.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/7/7c/T--BGU_Israel--notebook_week18.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
  function Parallax(element, options) {
+
<button class="accordion">Week 19</button>
    var self = this;
+
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/2/22/T--BGU_Israel--notebook_week19.pdf" width="100%" height="500">
 +
                        <embed src="https://static.igem.org/mediawiki/2018/2/22/T--BGU_Israel--notebook_week19.pdf" type="application/pdf" width="100%" height="600" />
 +
</object>
 +
</div>
  
    if (typeof options == 'object') {
+
<button class="accordion">Week 20</button>
      delete options.refresh;
+
<div class="panel2">
      delete options.render;
+
<object data="https://static.igem.org/mediawiki/2018/7/79/T--BGU_Israel--notebook_week20.pdf" width="100%" height="500">
      $.extend(this, options);
+
                        <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>
  
    this.$element = $(element);
+
</div>
 +
  </div>
 +
</div>
  
    if (!this.imageSrc && this.$element.is('img')) {
 
      this.imageSrc = this.$element.attr('src');
 
    }
 
  
    var positions = (this.position + '').toLowerCase().match(/\S+/g) || [];
+
<!-- July -->
 +
<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 (positions.length < 1) {
+
<button class="accordion">Week 22</button>
      positions.push('center');
+
<div class="panel2">
    }
+
<object data="https://static.igem.org/mediawiki/2018/d/db/T--BGU_Israel--notebook_week22.pdf" width="100%" height="500">
    if (positions.length == 1) {
+
                        <embed src="https://static.igem.org/mediawiki/2018/d/db/T--BGU_Israel--notebook_week22.pdf" type="application/pdf" width="100%" height="600" />
      positions.push(positions[0]);
+
</object>
    }
+
</div>
  
    if (positions[0] == 'top' || positions[0] == 'bottom' || positions[1] == 'left' || positions[1] == 'right') {
+
<button class="accordion">Week 23</button>
      positions = [positions[1], positions[0]];
+
<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.positionX !== undefined) positions[0] = this.positionX.toLowerCase();
+
<button class="accordion">Week 24</button>
    if (this.positionY !== undefined) positions[1] = this.positionY.toLowerCase();
+
<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>
  
    self.positionX = positions[0];
+
</div>
    self.positionY = positions[1];
+
  </div>
 +
</div>
  
    if (this.positionX != 'left' && this.positionX != 'right') {
+
<!-- August -->
      if (isNaN(parseInt(this.positionX))) {
+
<div id="august" class="bg-white text-center">
        this.positionX = 'center';
+
  <div class="row">
      } else {
+
<h1>August</h1>
        this.positionX = parseInt(this.positionX);
+
<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 (this.positionY != 'top' && this.positionY != 'bottom') {
 
      if (isNaN(parseInt(this.positionY))) {
 
        this.positionY = 'center';
 
      } else {
 
        this.positionY = parseInt(this.positionY);
 
      }
 
    }
 
  
    this.position =
+
</div>
      this.positionX + (isNaN(this.positionX)? '' : 'px') + ' ' +
+
  </div>
      this.positionY + (isNaN(this.positionY)? '' : 'px');
+
</div>
  
    if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
+
<!-- Experiments -->
      if (this.imageSrc && this.iosFix && !this.$element.is('img')) {
+
<div id="experiments" class="bg-grey text-center">
        this.$element.css({
+
  <div class="row">
          backgroundImage: 'url(' + this.imageSrc + ')',
+
<h1>Experiments</h1>
          backgroundSize: 'cover',
+
<div class="col-sm-8 col-sm-offset-2">
          backgroundPosition: this.position
+
<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">
      return this;
+
                        <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 (navigator.userAgent.match(/(Android)/)) {
+
<button class="accordion">Cytokine Inhibition</button>
      if (this.imageSrc && this.androidFix && !this.$element.is('img')) {
+
<div class="panel2">
        this.$element.css({
+
<object data="https://static.igem.org/mediawiki/2018/d/da/T--BGU_Israel--notebook_exp_qpcr.pdf" width="100%" height="500">
          backgroundImage: 'url(' + this.imageSrc + ')',
+
                        <embed src="https://static.igem.org/mediawiki/2018/d/da/T--BGU_Israel--notebook_exp_qpcr.pdf" type="application/pdf" width="100%" height="600" />
          backgroundSize: 'cover',
+
</object>
          backgroundPosition: this.position
+
</div>
        });
+
      }
+
      return this;
+
    }
+
  
    this.$mirror = $('<div />').prependTo(this.mirrorContainer);
+
<button class="accordion">Cell lines Infections with Lentivirus</button>
 +
<div class="panel2">
 +
<object data="https://static.igem.org/mediawiki/2018/0/0e/T--BGU_Israel--notebook_exp_lenti_infection.pdf" width="100%" height="500">
 +
                        <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" />
 +
</object>
 +
</div>
  
    var slider = this.$element.find('>.parallax-slider');
+
<button class="accordion">Promoter Assay</button>
    var sliderExisted = false;
+
<div class="panel2">
 +
<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 (slider.length == 0)
+
<button class="accordion">Reversed-Caspase-3 Induction</button>
      this.$slider = $('<img />').prependTo(this.$mirror);
+
<div class="panel2">
    else {
+
<object data="https://static.igem.org/mediawiki/2018/5/50/T--BGU_Israel--notebook_exp_caspase3.pdf" width="100%" height="500">
      this.$slider = slider.prependTo(this.$mirror)
+
                        <embed src="https://static.igem.org/mediawiki/2018/5/50/T--BGU_Israel--notebook_exp_caspase3.pdf" type="application/pdf" width="100%" height="600" />
      sliderExisted = true;
+
</object>
    }
+
</div>
  
    this.$mirror.addClass('parallax-mirror').css({
+
</div>
      visibility: 'hidden',
+
  </div>
      zIndex: this.zIndex,
+
</div>
      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) {
+
   <!-- accordion script -->
      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,059: 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.