iGEM 2016 — Team Istanbul_Tech

[![](https://static.igem.org/mediawiki/2016/8/8b/HQ_page_logo.jpg)](https://2016.igem.org)

# Team:Istanbul Tech/Notebook

html {

```
 font-size: 100%;
```

}

1. vgemcollaboration {

background-image:url('[https://static.igem.org/mediawiki/2016/d/de/T--Virginia--collabopen.png'](https://static.igem.org/mediawiki/2016/d/de/T--Virginia--collabopen.png%27));
position:absolute;
top:1000;
left:150;
background-size:180px 220px; /\*Adjust background-size and the width and height properties here if you wish to resize the icon\*/
width:180px;
height:220px;
z-index:100;
}

1. vgemcollaboration:hover {

background-image:url('[https://static.igem.org/mediawiki/2016/a/a5/T--Virginia--collabclosed.png'](https://static.igem.org/mediawiki/2016/a/a5/T--Virginia--collabclosed.png%27));
}

1. vgemcollaboration a {

display:inline-block;
width:100%;
height:100%;
}

body {

```
 font-size: 15px;
 font-size: 0.9375rem;
 font-family: "Open sans", Helvetica, Arial, sans-serif;
 color: #666666;
 padding: 0;
```

}
.topspace {

```
 margin-top: 40px;
```

}
/\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*

```
                           Navigation in header
```

* + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * /

.navbar {

```
 border-width: 1px 0;
 -webkit-border-radius: 0;
 -webkit-background-clip: padding-box;
 -moz-border-radius: 0;
 -moz-background-clip: padding;
 border-radius: 0;
 background-clip: padding-box;
 width: 100%;
```

}
.navbar.stick {

```
 position: fixed;
 top: 0;
 left: 0;
 opacity: .85;
```

}
.navbar-collapse {

```
 -webkit-border-radius: 0;
 -webkit-background-clip: padding-box;
 -moz-border-radius: 0;
 -moz-background-clip: padding;
 border-radius: 0;
 background-clip: padding-box;
 font-family: "Open sans", Helvetica, Arial, sans-serif;
 font-weight: 300;
 text-transform: uppercase;
```

}
.navbar-collapse .navbar-nav {

```
 float: none;
 margin: 0 auto;
 text-align: center;
```

}
.navbar-collapse .navbar-nav > li {

```
 float: none;
 display: inline-block;
```

}
.navbar-collapse .navbar-nav > li > a {

```
 padding: 20px 30px;
```

}
.dropdown ul.dropdown-menu {

```
 top: 85%;
 text-align: left;
```

}
.dropdown ul.dropdown-menu > li > a {

```
 padding: 5px 30px;
```

}
.navbar-default {

```
 background-color: #ffffff;
 border-color: #cccccc;
```

}
.navbar-default .navbar-nav > li > a {

```
 color: #454545;
```

}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {

```
 color: #000000;
 background-color: #ffffff;
```

}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {

```
 color: #000000;
 background-color: #ffffff;
```

}
.navbar-default .dropdown ul.dropdown-menu > li > a {

```
 color: #454545;
```

}
.navbar-default .dropdown ul.dropdown-menu > li > a:hover {

```
 background-color: #eeeeee;
 color: #000000;
```

}
.navbar-default .navbar-toggle {

```
 border-color: #666666;
```

}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {

```
 background-color: #ffffff;
```

}
.navbar-default .navbar-toggle .icon-bar {

```
 background-color: #333333;
```

}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {

```
 border-color: #cccccc;
```

}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {

```
 background-color: #ffffff;
 color: #000000;
```

}
/\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*

```
                                    Sidebar special Nav
```

* + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + /

.nav-side {

```
 font-size: 24px;
 font-size: 1.5rem;
 font-weight: 300;
 margin-top: -0.37em;
```

}
.nav-side > li > a {

```
 padding-top: 5px;
 padding-bottom: 5px;
 color: #f392b4;
```

}
.nav-side > li > a:hover {

```
 color: #bd1550;
 background: none;
```

}
.nav-side > li.active > a {

```
 color: #bd1550;
```

}
/\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*

```
                               TYPOGRAPHY
```

* + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * /

p {

```
 line-height: 1.6em;
 margin: 0 0 30px 0;
```

}
ul,
ol {

```
 line-height: 1.6em;
 margin: 0 0 30px 0;
```

}
blockquote {

```
 padding: 10px 20px;
 margin: 0 0 30px;
 border-left: 5px solid #eee;
```

}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {

```
 font-family: "Open sans", Helvetica, Arial, sans-serif;
 font-weight: 400;
 color: #333333;
```

}
h1 {

```
 font-size: 40px;
 font-size: 2.5rem;
```

}
h2 {

```
 font-size: 36px;
 font-size: 2.25rem;
```

}
h3 {

```
 font-size: 30px;
 font-size: 1.875rem;
```

}
h4 {

```
 font-size: 24px;
 font-size: 1.5rem;
```

}
h5 {

```
 font-size: 20px;
 font-size: 1.25rem;
```

}
a {

```
 color: #bd1550;
```

}
a:hover {

```
 color: #e93675;
```

}
.lead {

```
 font-weight: 300;
 font-size: 21px;
 font-size: 1.3125rem;
```

}
.text-msg {

```
 line-height: 1.7em;
 color: #b3b3b3;
 font-weight: 300;
 text-transform: capitalize;
 margin-top: -0.23em;
```

}
.size-auto,
.size-full,
.size-large,
.size-medium,
.size-thumbnail {

```
 max-width: 100%;
 height: auto;
```

}
/\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*

```
                               HEADER
```

* + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * /

1. head {

```
 background: #f4f4f4 url(![T--Istanbul_Tech--bg_head.jpg](https://static.igem.org/mediawiki/2016/1/1e/T--Istanbul_Tech--bg_head.jpg)
```

}

1. head img.img-circle {

```
 display: block;
 width: 140px;
 height: 140px;
 overflow: hidden;
 border: 9px solid rgba(0, 0, 0, 0.05);
 margin: 0 auto;
```

}

1. head .title {

```
 font-family: Alice, Georgia, serif;
 font-size: 49px;
 font-size: 3.0625rem;
```

}

1. head .title a {

```
 text-decoration: none;
 color: #333333;
```

}

1. head .tagline {

```
 display: block;
 font-size: 14px;
 font-size: 0.875rem;
 line-height: 1.2em;
 color: #7C7C7C;
 margin: 5px 0 0;
```

}

1. head .tagline b {

```
 font-weight: normal;
```

}

1. head .tagline a {

```
 color: #5E5E5E;
```

}
.home #head {

```
 padding: 90px 0;
```

}
.home #head .title {

```
 font-size: 49px;
 font-size: 3.0625rem;
```

}
.home #head .tagline {

```
 font-size: 16px;
 font-size: 1rem;
 margin: 15px 0 0;
```

}
/\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*

```
                               CONTENT
```

* + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * /

img {

```
 max-width: 100%;
```

}
.btn {

```
 font-size: 12px;
 font-size: 0.75rem;
 text-decoration: none;
 text-transform: uppercase;
 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 color: #333;
 -webkit-border-radius: 0px;
 -webkit-background-clip: padding-box;
 -moz-border-radius: 0px;
 -moz-background-clip: padding;
 border-radius: 0px;
 background-clip: padding-box;
 -webkit-transition-property: all;
 -moz-transition-property: all;
 -o-transition-property: all;
 -ms-transition-property: all;
 transition-property: all;
 -webkit-transition-duration: 0.2s;
 -moz-transition-duration: 0.2s;
 -o-transition-duration: 0.2s;
 transition-duration: 0.2s;
 border: 0 none;
 padding: 12px 35px;
 text-shadow: 0 1px 0px #780d33;
```

}
.btn-primary {

```
 color: #fff;
 background-color: #bd1550;
```

}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {

```
 color: #fff;
 background-color: #e61f65;
```

}
.btn-action {

```
 font-weight: bold;
 background: transparent!important;
 border: 1px solid #333;
 text-shadow: none;
```

}
.btn-action:hover,
.btn-action:focus,
.btn-action:active,
.btn-action.active {

```
 color: #bd1550;
 border-color: #bd1550;
```

}
.btn-lg {

```
 padding: 15px 60px;
 font-size: 12px;
 line-height: 1.33;
 font-weight: bold;
```

}
.panel-cta {

```
 box-shadow: 0 0 0 1px #e1e1e1, 0 0 0 3px #fff, 0 0 0 4px #e1e1e1;
 background: #f3f3f3;
 -webkit-border-radius: 0;
 -webkit-background-clip: padding-box;
 -moz-border-radius: 0;
 -moz-background-clip: padding;
 border-radius: 0;
 background-clip: padding-box;
```

}
.panel-cta p,
.panel-cta h3,
.panel-cta h4,
.panel-cta h5,
.panel-cta h6 {

```
 margin: 0;
```

}
.panel-cta .panel-body {

```
 padding: 35px;
```

}
/\* Section - Featured \*/
.featured {

```
 font-size: 13px;
 font-size: 0.8125rem;
```

}
.featured h3 {

```
 font-weight: bold;
 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 font-size: 24px;
 font-size: 1.5rem;
 text-transform: uppercase;
 line-height: 1.4em;
 vertical-align: middle;
 margin: 0 0 25px 0;
```

}
/\* Section - Recent works \*/
.thumbnails {

```
 padding: 0;
```

}
.thumbnails li {

```
 margin-bottom: 30px;
```

}
.thumbnails .details {

```
 display: block;
 text-align: center;
 font-size: 12px;
 font-size: 0.75rem;
```

}
.thumbnail {

```
 display: block;
 -webkit-border-radius: 0;
 -webkit-background-clip: padding-box;
 -moz-border-radius: 0;
 -moz-background-clip: padding;
 border-radius: 0;
 background-clip: padding-box;
 border: 0 none;
 margin-bottom: 10px;
 padding: 0;
 text-align: center;
 text-decoration: none;
 color: #333;
```

}
.thumbnail .img {

```
 display: block;
 width: 100%;
 overflow: hidden;
 height: 180px;
 margin: 0 0 20px;
 position: relative;
```

}
.thumbnail .title {

```
 text-transform: uppercase;
 margin: 0 2em;
 display: block;
 text-indent: 0;
```

}
.thumbnail .cover {

```
 position: absolute;
 display: block;
 opacity: 0;
 width: 100%;
 height: 180px;
 background-color: rgba(255, 255, 255, 0.8);
 -webkit-transition-property: all;
 -moz-transition-property: all;
 -o-transition-property: all;
 -ms-transition-property: all;
 transition-property: all;
 -webkit-transition-duration: 550ms;
 -moz-transition-duration: 550ms;
 -o-transition-duration: 550ms;
 transition-duration: 550ms;
```

}
.thumbnail .cover .more {

```
 position: absolute;
 bottom: 15px;
 right: 0;
 height: 32px;
 line-height: 32px;
 padding: 0 20px;
 -webkit-border-radius: 1px 0 0 1px;
 -webkit-background-clip: padding-box;
 -moz-border-radius: 1px 0 0 1px;
 -moz-background-clip: padding;
 border-radius: 1px 0 0 1px;
 background-clip: padding-box;
 font-size: 12px;
 font-size: 0.75rem;
 text-transform: uppercase;
 text-shadow: 0 1px 0px #780d33;
 background: #bd1550;
 color: white;
```

}
.thumbnail img {

```
 width: 100%;
 position: absolute;
 top: 0;
 left: 0;
```

}
.thumbnail:hover {

```
 color: #333;
 text-decoration: none;
```

}
.thumbnail:hover img {

```
 -webkit-filter: saturate(0%);
```

}
.thumbnail:hover .cover {

```
 opacity: 1;
```

}
/\* pagination \*/
.pagination > li > a {

```
 color: #808080;
 border: 0 none;
 font-size: 20px;
 font-size: 1.25rem;
 font-family: Georgia, serif;
```

}
.pagination > li > a:hover {

```
 color: #000000;
 background: none;
```

}
.pagination > li.active > a {

```
 color: #333333;
 background: none;
```

}
.pagination > li.active > a:hover {

```
 color: #000000;
 background: none;
```

}
/\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*

```
                                BLOG
```

* + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * /

.section-title,
.entry-title {

```
 display: block;
 width: 100%;
 overflow: hidden;
 margin: 0px 0 25px;
 text-align: center;
 font-weight: 300;
 text-transform: uppercase;
 font-size: 36px;
 font-size: 2.25rem;
 letter-spacing: 1px;
```

}
.section-title a,
.entry-title a {

```
 color: #333333;
```

}
.section-title span,
.entry-title span {

```
 display: inline-block;
 position: relative;
```

}
.section-title span:before,
.entry-title span:before,
.section-title span:after,
.entry-title span:after {

```
 content: "";
 position: absolute;
 height: 4px;
 top: .53em;
 width: 400%;
 border-bottom: 1px solid #ccc;
 border-top: 1px solid #ccc;
```

}
.section-title span:before,
.entry-title span:before {

```
 right: 100%;
 margin-right: 45px;
```

}
.section-title span:after,
.entry-title span:after {

```
 left: 100%;
 margin-left: 45px;
```

}
.entry-header .entry-meta {

```
 text-align: center;
 font-family: Georgia, serif;
 font-size: 18px;
 font-size: 1.125rem;
 font-style: italic;
 font-weight: normal;
 color: #a5a5a5;
 margin: 0 0 15px 0;
```

}
.entry-header .entry-meta a {

```
 color: #a5a5a5;
```

}
.entry-content {

```
 margin: 0 0 60px 0;
```

}
.entry-content h2 {

```
 line-height: 1.2;
 font-size: 30px;
 font-size: 1.875rem;
 padding-top: 20px;
 margin-bottom: 20px;
```

}
.meta-nav,
.more-link {

```
 font-family: Georgia, serif;
 font-style: italic;
 font-weight: bold;
 color: #666666;
 text-decoration: none;
```

}
.meta-nav:hover,
.more-link:hover {

```
 color: #333333;
 text-decoration: underline;
```

}
.more-link {

```
 display: block;
 width: 100%;
 text-align: right;
```

}
/\* Posts navigation \*/

1. nav-below {

```
 position: fixed;
 top: 48%;
```

}

1. nav-below .meta-nav {

```
 display: block;
 padding: 27px 7px;
 background: #444;
 color: #fff;
 -webkit-border-radius: 3px;
 -webkit-background-clip: padding-box;
 -moz-border-radius: 3px;
 -moz-background-clip: padding;
 border-radius: 3px;
 background-clip: padding-box;
 font-family: "Open sans", Helvetica, Arial, sans-serif;
 font-style: normal;
 font-weight: normal;
 text-decoration: none;
 opacity: 0.2;
```

}

1. nav-below .meta-nav:hover {

```
 text-decoration: none;
 color: #333;
```

}

1. nav-below .nav-next {

```
 position: fixed;
 right: -3px;
```

}

1. nav-below .nav-previous {

```
 position: fixed;
 left: -3px;
```

}

1. nav-below b {

```
 display: none;
```

}
footer.entry-meta {

```
 border-top: 1px solid #ccc;
 border-bottom: 1px solid #ccc;
 margin: 0 0 35px 0;
 padding: 2px 0;
 color: #888888;
 font-size: 12px;
 font-size: 0.75rem;
```

}
footer.entry-meta a {

```
 color: #333333;
```

}
footer.entry-meta .meta-in {

```
 border-top: 1px solid #ccc;
 border-bottom: 1px solid #ccc;
 padding: 10px 0;
```

}
.page-header {

```
 padding-bottom: 0;
 margin: 0;
 border-bottom: none;
 text-align: left;
```

}
.page-header .page-title {

```
 margin-top: 0;
 margin-bottom: 30px;
```

}
/\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*

```
                               COMMENTS
```

* + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * /

1. comments {

```
 font-size: 13px;
 font-size: 0.8125rem;
```

}

1. comments .comments-title {

```
 margin: 0 0 5px 0;
```

}

1. comments .leave-comment {

```
 display: block;
 margin: 0 0 40px 0;
```

}

1. comments ul,
2. comments ol {

```
 margin: 0;
 padding: 0;
```

}

1. comments .comment {

```
 margin: 0;
 padding: 0;
 list-style: none;
 clear: both;
```

}

1. comments .comments-title {

```
 text-shadow: none;
 margin-bottom: 0;
```

}

1. comments .avatar {

```
 float: left;
 width: 70px;
 height: 70px;
 margin-bottom: 30px;
 border: 5px solid #eeeeee;
 -webkit-border-radius: 50%;
 -webkit-background-clip: padding-box;
 -moz-border-radius: 50%;
 -moz-background-clip: padding;
 border-radius: 50%;
 background-clip: padding-box;
```

}

1. comments .children {

```
 margin: 0 0 0 90px;
```

}

1. comments .comment-meta {

```
 margin: 0 0 0 90px;
```

}

1. comments .comment-meta a {

```
 color: #333333;
```

}

1. comments .comment-meta a:hover {

```
 color: #bd1550;
```

}

1. comments .comment-meta .author {

```
 margin: 0 20px 0 0;
 font-weight: bold;
```

}

1. comments .comment-meta .date {

```
 margin: 0 20px 0 0;
```

}

1. comments .comment-meta .date a {

```
 color: #666666;
```

}

1. comments .comment-meta .reply {

```
 float: right;
```

}

1. comments .comment-body {

```
 margin: 0 0 35px 90px;
```

}
.comment-navigation {

```
 width: 100%;
 border-top: 1px solid #ccc;
 padding: 2px 0 0 0;
```

}
.comment-navigation .nav-content {

```
 border-top: 1px solid #ccc;
 width: 100%;
 padding: 10px 0 0 0;
```

}
.comment-navigation .nav-previous {

```
 float: left;
 width: 50%;
```

}
.comment-navigation .nav-next {

```
 float: right;
 width: 50%;
 text-align: right;
```

}

1. respond {

```
 margin: 55px 0 0 0;
```

}
/\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*

```
                               FOOTER
```

* + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * + - * /

1. footer {

```
 background: #232323;
 padding: 30px 0 0 0;
 font-size: 12px;
 color: #999;
```

}

1. footer a {

```
 color: #ccc;
```

}

1. footer a:hover {

```
 color: #fff;
```

}

1. footer h3.widget-title {

```
 font-size: 15px;
 font-size: 0.9375rem;
 text-transform: uppercase;
 color: #ccc;
 margin: 0 0 20px;
```

}

1. underfooter {

```
 background: #191919;
 padding: 15px 0;
 color: #777;
 font-size: 12px;
```

}

1. underfooter a {

```
 color: #aaa;
```

}

1. underfooter a:hover {

```
 color: #fff;
```

}

1. underfooter p {

```
 margin: 0;
```

}
.follow-me-icons {

```
 font-size: 30px;
```

}
.follow-me-icons i {

```
 float: left;
 margin: 0 10px 0 0;
```

}
/\* Max page width
/////////////////////////////////////////////////////////////////////\*/
@media (min-width: 1200px) {

```
 .container {
   max-width: 1080px;
 }
```

}

Document the dates you worked on your project.

##### What should this page have?

* Chronological notes of what your team is doing.
* Brief descriptions of daily important events.
* Pictures of your progress.
* Mention who participated in what task.

##### Inspiration

You can see what others teams have done to organize their notes:

* [2014 ATOMS-Turkiye](https://2014.igem.org/Team%3AATOMS-Turkiye/Notebook)
* [2014 Tec Monterrey](https://2014.igem.org/Team%3ATec-Monterrey/ITESM14_project.html#tab_notebook)
* [2014 Kyoto](https://2014.igem.org/Team%3AKyoto/Notebook/Magnetosome_Formation#title)
* [2014 Cornell](https://2014.igem.org/Team%3ACornell/notebook)

[![](https://static.igem.org/mediawiki/2016/b/bf/HQ_menu_logo.jpg)](https://2016.igem.org)