Difference between revisions of "Team:York/TestBed"

 
(173 intermediate revisions by the same user not shown)
Line 1: Line 1:
 +
{{:Team:York/Templates/NavigationBar}}
 +
 
<html>
 
<html>
 +
<!DOCTYPE html>
 +
<script type="text/javascript">
 +
  var images = new Array();
 +
  images[0] = "//2017.igem.org/wiki/images/d/d4/TeamYork-Headshots-Sam1.jpg";
 +
  images[1] = "https://static.igem.org/mediawiki/2017/f/f9/TeamYork-Headshots-Sam2.jpg";
 +
  images[2] = "https://static.igem.org/mediawiki/2017/d/d0/TeamYork-Headshots-Helen.jpg";
 +
  images[3] = "https://static.igem.org/mediawiki/2017/0/0b/TeamYork-Headshots-Marta.jpg";
 +
  images[4] = "https://static.igem.org/mediawiki/2017/b/b3/TeamYork-Headshots-Joel.jpg";
 +
  images[5] = "https://static.igem.org/mediawiki/2017/8/8a/TeamYork-Headshots-Igors.jpg";
 +
  images[6] = "https://static.igem.org/mediawiki/2017/0/09/TeamYork-Headshots-Nathan.jpg";
 +
  images[7] = "https://static.igem.org/mediawiki/2017/0/08/TeamYork-Headshots-Aeri.jpg";
 +
  images[8] = "https://static.igem.org/mediawiki/2017/1/1c/TeamYork-Headshots-Joe.jpg";
 +
  images[9] = "DOMIMAGE";
 +
  images[10] = "//2017.igem.org/wiki/images/d/d4/TeamYork-Headshots-Sam1.jpg";
 +
  images[11] = "https://static.igem.org/mediawiki/2017/f/f9/TeamYork-Headshots-Sam2.jpg";
 +
  images[12] = "https://static.igem.org/mediawiki/2017/d/d0/TeamYork-Headshots-Helen.jpg";
 +
  images[13] = "https://static.igem.org/mediawiki/2017/0/0b/TeamYork-Headshots-Marta.jpg";
 +
  images[14] = "https://static.igem.org/mediawiki/2017/b/b3/TeamYork-Headshots-Joel.jpg";
 +
  images[15] = "https://static.igem.org/mediawiki/2017/8/8a/TeamYork-Headshots-Igors.jpg";
 +
  images[16] = "https://static.igem.org/mediawiki/2017/0/09/TeamYork-Headshots-Nathan.jpg";
 +
  images[17] = "https://static.igem.org/mediawiki/2017/0/08/TeamYork-Headshots-Aeri.jpg";
 +
  images[18] = "https://static.igem.org/mediawiki/2017/1/1c/TeamYork-Headshots-Joe.jpg";
 +
  images[19] = "DOMIMAGE";
  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+
  var imagetext = new Array();
<script>
+
  imagetext[0] = "Sam F: a proud member of Homo cynicus.";
$("div").remove(".logo_2017");
+
  imagetext[1] = "Sam A: likes to pretend he's only half German... but look at him.";
</script>
+
  imagetext[2] = "Helen: loud and proud. Mostly loud.";
 +
  imagetext[3] = "Marta: TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC.";
 +
  imagetext[4] = "Joel: can see the matrix... if it's written in MATLAB.";
 +
  imagetext[5] = "Igors: he's ALIVE!";
 +
  imagetext[6] = "Nathan: lean, mean, meme machine.";
 +
  imagetext[7] = "Malin Imo Kristina Olsson Sundstrom: Aeri, for short.";
 +
  imagetext[8] = "Joe: TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC.";
 +
  imagetext[9] = "Dom: TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC.";
 +
  imagetext[10] = "Sam F: a proud member of Homo cynicus.";
 +
  imagetext[11] = "Sam A: likes to pretend he's only half German... but look at him.";
 +
  imagetext[12] = "Helen: loud and proud. Mostly loud.";
 +
  imagetext[13] = "Marta: half person, half Jaffa Cake.";
 +
  imagetext[14] = "Joel: can see the matrix... if it's written in MATLAB.";
 +
  imagetext[15] = "Igors: he's ALIVE!";
 +
  imagetext[16] = "Nathan: lean, mean, meme machine.";
 +
  imagetext[17] = "Malin Imo Kristina Olsson Sundstrom: Aeri, for short.";
 +
  imagetext[18] = "Joe: TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC.";
 +
  imagetext[19] = "Dom: TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC. TBC.";
  
<!--<meta name="viewport" content="user-scalable=1, width=400">-->
+
  function changeImage1() {
<meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0" />
+
    document.getElementById('TeamImg1').src = images[x];
 +
    if (x<16) {
 +
      x+=4;
 +
    }
  
 +
    else if (x>=16) {
 +
      x=0;
 +
    }
 +
    setTimeout(function () {
 +
      document.getElementById('TeamImg1Text').textContent = imagetext[a];
 +
      if (a<16) {
 +
        a+=4;
 +
      }
  
 +
      else if (a>=16) {
 +
        a=0;
 +
      }
 +
    }, 100);
 +
  }
  
 +
  function changeImage2() {
 +
    document.getElementById('TeamImg2').src = images[y];
 +
    if (y<17) {
 +
      y+=4;
 +
    }
  
<style>
+
    else if (y>=17) {
 +
      y=1;
 +
    }
 +
    setTimeout(function () {
 +
      document.getElementById('TeamImg2Text').textContent = imagetext[b];
 +
      if (b<17) {
 +
        b+=4;
 +
      }
  
 +
      else if (b>=17) {
 +
        b=1;
 +
      }
 +
    }, 100);
 +
  }
  
/*!
+
  function changeImage3() {
* Bootstrap v3.1.0 (http://getbootstrap.com)
+
    document.getElementById('TeamImg3').src = images[z];
* Copyright 2011-2014 Twitter, Inc.
+
    if (z<18) {
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+
      z+=4;
*/
+
    }
  
/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
+
    else if (z>=18) {
 +
      z=2;
 +
    }
 +
    setTimeout(function () {
 +
      document.getElementById('TeamImg3Text').textContent = imagetext[c];
 +
      if (c<18) {
 +
        c+=4;
 +
      }
  
*:not(#top_menu_14; #top_menu_under; #sideMenu;){
+
      else if (c>=18) {
html {
+
        c=2;
  font-family: sans-serif;
+
       }
  -webkit-text-size-adjust: 100%;
+
    }, 100);
       -ms-text-size-adjust: 100%;
+
}
+
body {
+
  margin: 0;
+
}
+
article,
+
aside,
+
details,
+
figcaption,
+
figure,
+
footer,
+
header,
+
hgroup,
+
main,
+
nav,
+
section,
+
summary {
+
  display: block;
+
}
+
audio,
+
canvas,
+
progress,
+
video {
+
  display: inline-block;
+
  vertical-align: baseline;
+
}
+
audio:not([controls]) {
+
  display: none;
+
  height: 0;
+
}
+
[hidden],
+
template {
+
  display: none;
+
}
+
a {
+
  background: transparent;
+
}
+
a:active,
+
a:hover {
+
  outline: 0;
+
}
+
abbr[title] {
+
  border-bottom: 1px dotted;
+
}
+
b,
+
strong {
+
  font-weight: bold;
+
}
+
dfn {
+
  font-style: italic;
+
}
+
h1 {
+
  margin: .67em 0;
+
  font-size: 2em;
+
}
+
mark {
+
  color: #000;
+
  background: #ff0;
+
}
+
small {
+
  font-size: 80%;
+
}
+
sub,
+
sup {
+
  position: relative;
+
  font-size: 75%;
+
  line-height: 0;
+
  vertical-align: baseline;
+
}
+
sup {
+
  top: -.5em;
+
}
+
sub {
+
  bottom: -.25em;
+
}
+
img {
+
  border: 0;
+
}
+
svg:not(:root) {
+
  overflow: hidden;
+
}
+
figure {
+
  margin: 1em 40px;
+
}
+
hr {
+
  height: 0;
+
  -moz-box-sizing: content-box;
+
      box-sizing: content-box;
+
}
+
pre {
+
  overflow: auto;
+
}
+
code,
+
kbd,
+
pre,
+
samp {
+
  font-family: monospace, monospace;
+
  font-size: 1em;
+
}
+
button,
+
input,
+
optgroup,
+
select,
+
textarea {
+
  margin: 0;
+
  font: inherit;
+
  color: inherit;
+
}
+
button {
+
  overflow: visible;
+
}
+
button,
+
select {
+
  text-transform: none;
+
}
+
button,
+
html input[type="button"],
+
input[type="reset"],
+
input[type="submit"] {
+
  -webkit-appearance: button;
+
  cursor: pointer;
+
}
+
button[disabled],
+
html input[disabled] {
+
  cursor: default;
+
}
+
button::-moz-focus-inner,
+
input::-moz-focus-inner {
+
  padding: 0;
+
  border: 0;
+
}
+
input {
+
  line-height: normal;
+
}
+
input[type="checkbox"],
+
input[type="radio"] {
+
  box-sizing: border-box;
+
  padding: 0;
+
}
+
input[type="number"]::-webkit-inner-spin-button,
+
input[type="number"]::-webkit-outer-spin-button {
+
  height: auto;
+
}
+
input[type="search"] {
+
  -webkit-box-sizing: content-box;
+
    -moz-box-sizing: content-box;
+
          box-sizing: content-box;
+
  -webkit-appearance: textfield;
+
}
+
input[type="search"]::-webkit-search-cancel-button,
+
input[type="search"]::-webkit-search-decoration {
+
  -webkit-appearance: none;
+
}
+
fieldset {
+
  padding: .35em .625em .75em;
+
  margin: 0 2px;
+
  border: 1px solid #c0c0c0;
+
}
+
legend {
+
  padding: 0;
+
  border: 0;
+
}
+
textarea {
+
  overflow: auto;
+
}
+
optgroup {
+
  font-weight: bold;
+
}
+
table {
+
  border-spacing: 0;
+
  border-collapse: collapse;
+
}
+
td,
+
th {
+
  padding: 0;
+
}
+
@media print {
+
  * {
+
    color: #000 !important;
+
    text-shadow: none !important;
+
    background: transparent !important;
+
    box-shadow: none !important;
+
 
   }
 
   }
  a,
 
  a:visited {
 
    text-decoration: underline;
 
  }
 
  a[href]:after {
 
    content: " (" attr(href) ")";
 
  }
 
  abbr[title]:after {
 
    content: " (" attr(title) ")";
 
  }
 
  a[href^="javascript:"]:after,
 
  a[href^="#"]:after {
 
    content: "";
 
  }
 
  pre,
 
  blockquote {
 
    border: 1px solid #999;
 
  
     page-break-inside: avoid;
+
     var x = 0; a = 0; y = 1; b = 1; z = 2; c = 2;
  }
+
     setInterval(function() {
  thead {
+
      changeImage1(); changeImage2(); changeImage3();
    display: table-header-group;
+
     },5000);
  }
+
</script>
  tr,
+
    
  img {
+
<style>
    page-break-inside: avoid;
+
.TeamImg {
  }
+
   object-fit: cover;
  img {
+
    max-width: 100% !important;
+
  }
+
  p,
+
  h2,
+
  h3 {
+
    orphans: 3;
+
    widows: 3;
+
  }
+
  h2,
+
  h3 {
+
     page-break-after: avoid;
+
  }
+
  select {
+
    background: #fff !important;
+
  }
+
  .navbar {
+
     display: none;
+
  }
+
  .table td,
+
  .table th {
+
    background-color: #fff !important;
+
  }
+
   .btn > .caret,
+
  .dropup > .btn > .caret {
+
    border-top-color: #000 !important;
+
  }
+
  .label {
+
    border: 1px solid #000;
+
   }
+
  .table {
+
    border-collapse: collapse !important;
+
  }
+
  .table-bordered th,
+
  .table-bordered td {
+
    border: 1px solid #ddd !important;
+
  }
+
 
}
 
}
* {
 
  -webkit-box-sizing: border-box;
 
    -moz-box-sizing: border-box;
 
          box-sizing: border-box;
 
}
 
*:before,
 
*:after {
 
  -webkit-box-sizing: border-box;
 
    -moz-box-sizing: border-box;
 
          box-sizing: border-box;
 
}
 
html {
 
  font-size: 62.5%;
 
 
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 
}
 
body {
 
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 
  font-size: 14px;
 
  color: #333;
 
  background-color: #fff;
 
}
 
input,
 
button,
 
select,
 
textarea {
 
  font-family: inherit;
 
  font-size: inherit;
 
  line-height: inherit;
 
}
 
a {
 
  color: #428bca;
 
  text-decoration: none;
 
}
 
a:hover,
 
a:focus {
 
  color: #2a6496;
 
  text-decoration: underline;
 
}
 
a:focus {
 
  outline: thin dotted;
 
  outline: 5px auto -webkit-focus-ring-color;
 
  outline-offset: -2px;
 
}
 
figure {
 
  margin: 0;
 
}
 
img {
 
  vertical-align: middle;
 
}
 
.img-responsive {
 
  display: block;
 
  max-width: 100%;
 
  height: auto;
 
}
 
.img-rounded {
 
  border-radius: 6px;
 
}
 
.img-thumbnail {
 
  display: inline-block;
 
  max-width: 100%;
 
  height: auto;
 
  padding: 4px;
 
  line-height: 1.428571429;
 
  background-color: #fff;
 
  border: 1px solid #ddd;
 
  border-radius: 4px;
 
  -webkit-transition: all .2s ease-in-out;
 
          transition: all .2s ease-in-out;
 
}
 
.img-circle {
 
  border-radius: 50%;
 
}
 
hr {
 
  margin-top: 20px;
 
  margin-bottom: 20px;
 
  border: 0;
 
  border-top: 1px solid #eee;
 
}
 
.sr-only {
 
  position: absolute;
 
  width: 1px;
 
  height: 1px;
 
  padding: 0;
 
  margin: -1px;
 
  overflow: hidden;
 
  clip: rect(0, 0, 0, 0);
 
  border: 0;
 
}
 
h1,
 
h2,
 
h3,
 
h4,
 
h5,
 
h6,
 
.h1,
 
.h2,
 
.h3,
 
.h4,
 
.h5,
 
.h6 {
 
  font-family: inherit;
 
  font-weight: 500;
 
  line-height: 1.1;
 
  color: inherit;
 
}
 
h1 small,
 
h2 small,
 
h3 small,
 
h4 small,
 
h5 small,
 
h6 small,
 
.h1 small,
 
.h2 small,
 
.h3 small,
 
.h4 small,
 
.h5 small,
 
.h6 small,
 
h1 .small,
 
h2 .small,
 
h3 .small,
 
h4 .small,
 
h5 .small,
 
h6 .small,
 
.h1 .small,
 
.h2 .small,
 
.h3 .small,
 
.h4 .small,
 
.h5 .small,
 
.h6 .small {
 
  font-weight: normal;
 
  line-height: 1;
 
  color: #999;
 
}
 
h1,
 
.h1,
 
h2,
 
.h2,
 
h3,
 
.h3 {
 
  margin-top: 20px;
 
  margin-bottom: 10px;
 
}
 
h1 small,
 
.h1 small,
 
h2 small,
 
.h2 small,
 
h3 small,
 
.h3 small,
 
h1 .small,
 
.h1 .small,
 
h2 .small,
 
.h2 .small,
 
h3 .small,
 
.h3 .small {
 
  font-size: 65%;
 
}
 
h4,
 
.h4,
 
h5,
 
.h5,
 
h6,
 
.h6 {
 
  margin-top: 10px;
 
  margin-bottom: 10px;
 
}
 
h4 small,
 
.h4 small,
 
h5 small,
 
.h5 small,
 
h6 small,
 
.h6 small,
 
h4 .small,
 
.h4 .small,
 
h5 .small,
 
.h5 .small,
 
h6 .small,
 
.h6 .small {
 
  font-size: 75%;
 
}
 
h1,
 
.h1 {
 
  font-size: 36px;
 
}
 
h2,
 
.h2 {
 
  font-size: 30px;
 
}
 
h3,
 
.h3 {
 
  font-size: 24px;
 
}
 
h4,
 
.h4 {
 
  font-size: 18px;
 
}
 
h5,
 
.h5 {
 
  font-size: 14px;
 
}
 
h6,
 
.h6 {
 
  font-size: 12px;
 
}
 
p {
 
  margin: 0 0 10px;
 
}
 
.lead {
 
  margin-bottom: 20px;
 
  font-size: 16px;
 
  font-weight: 200;
 
  line-height: 1.4;
 
}
 
@media (min-width: 768px) {
 
  .lead {
 
    font-size: 21px;
 
  }
 
}
 
small,
 
.small {
 
  font-size: 85%;
 
}
 
cite {
 
  font-style: normal;
 
}
 
.text-left {
 
  text-align: left;
 
}
 
.text-right {
 
  text-align: right;
 
}
 
.text-center {
 
  text-align: center;
 
}
 
.text-justify {
 
  text-align: justify;
 
}
 
.text-muted {
 
  color: #999;
 
}
 
.text-primary {
 
  color: #428bca;
 
}
 
a.text-primary:hover {
 
  color: #3071a9;
 
}
 
.text-success {
 
  color: #3c763d;
 
}
 
a.text-success:hover {
 
  color: #2b542c;
 
}
 
.text-info {
 
  color: #31708f;
 
}
 
a.text-info:hover {
 
  color: #245269;
 
}
 
.text-warning {
 
  color: #8a6d3b;
 
}
 
a.text-warning:hover {
 
  color: #66512c;
 
}
 
.text-danger {
 
  color: #a94442;
 
}
 
a.text-danger:hover {
 
  color: #843534;
 
}
 
.bg-primary {
 
  color: #fff;
 
  background-color: #428bca;
 
}
 
a.bg-primary:hover {
 
  background-color: #3071a9;
 
}
 
.bg-success {
 
  background-color: #dff0d8;
 
}
 
a.bg-success:hover {
 
  background-color: #c1e2b3;
 
}
 
.bg-info {
 
  background-color: #d9edf7;
 
}
 
a.bg-info:hover {
 
  background-color: #afd9ee;
 
}
 
.bg-warning {
 
  background-color: #fcf8e3;
 
}
 
a.bg-warning:hover {
 
  background-color: #f7ecb5;
 
}
 
.bg-danger {
 
  background-color: #f2dede;
 
}
 
a.bg-danger:hover {
 
  background-color: #e4b9b9;
 
}
 
.page-header {
 
  padding-bottom: 9px;
 
  margin: 40px 0 20px;
 
  border-bottom: 1px solid #eee;
 
}
 
ul,
 
ol {
 
  margin-top: 0;
 
  margin-bottom: 10px;
 
}
 
ul ul,
 
ol ul,
 
ul ol,
 
ol ol {
 
  margin-bottom: 0;
 
}
 
.list-unstyled {
 
  padding-left: 0;
 
  list-style: none;
 
}
 
.list-inline {
 
  padding-left: 0;
 
  list-style: none;
 
}
 
.list-inline > li {
 
  display: inline-block;
 
  padding-right: 5px;
 
  padding-left: 5px;
 
}
 
.list-inline > li:first-child {
 
  padding-left: 0;
 
}
 
dl {
 
  margin-top: 0;
 
  margin-bottom: 20px;
 
}
 
dt,
 
dd {
 
  line-height: 1.428571429;
 
}
 
dt {
 
  font-weight: bold;
 
}
 
dd {
 
  margin-left: 0;
 
}
 
@media (min-width: 768px) {
 
  .dl-horizontal dt {
 
    float: left;
 
    width: 160px;
 
    overflow: hidden;
 
    clear: left;
 
    text-align: right;
 
    text-overflow: ellipsis;
 
    white-space: nowrap;
 
  }
 
  .dl-horizontal dd {
 
    margin-left: 180px;
 
  }
 
}
 
abbr[title],
 
abbr[data-original-title] {
 
  cursor: help;
 
  border-bottom: 1px dotted #999;
 
}
 
.initialism {
 
  font-size: 90%;
 
  text-transform: uppercase;
 
}
 
blockquote {
 
  padding: 10px 20px;
 
  margin: 0 0 20px;
 
  font-size: 17.5px;
 
  border-left: 5px solid #eee;
 
}
 
blockquote p:last-child,
 
blockquote ul:last-child,
 
blockquote ol:last-child {
 
  margin-bottom: 0;
 
}
 
blockquote footer,
 
blockquote small,
 
blockquote .small {
 
  display: block;
 
  font-size: 80%;
 
  line-height: 1.428571429;
 
  color: #999;
 
}
 
blockquote footer:before,
 
blockquote small:before,
 
blockquote .small:before {
 
  content: '\2014 \00A0';
 
}
 
.blockquote-reverse,
 
blockquote.pull-right {
 
  padding-right: 15px;
 
  padding-left: 0;
 
  text-align: right;
 
  border-right: 5px solid #eee;
 
  border-left: 0;
 
}
 
.blockquote-reverse footer:before,
 
blockquote.pull-right footer:before,
 
.blockquote-reverse small:before,
 
blockquote.pull-right small:before,
 
.blockquote-reverse .small:before,
 
blockquote.pull-right .small:before {
 
  content: '';
 
}
 
.blockquote-reverse footer:after,
 
blockquote.pull-right footer:after,
 
.blockquote-reverse small:after,
 
blockquote.pull-right small:after,
 
.blockquote-reverse .small:after,
 
blockquote.pull-right .small:after {
 
  content: '\00A0 \2014';
 
}
 
blockquote:before,
 
blockquote:after {
 
  content: "";
 
}
 
address {
 
  margin-bottom: 20px;
 
  font-style: normal;
 
  line-height: 1.428571429;
 
}
 
code,
 
kbd,
 
pre,
 
samp {
 
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
 
}
 
code {
 
  padding: 2px 4px;
 
  font-size: 90%;
 
  color: #c7254e;
 
  white-space: nowrap;
 
  background-color: #f9f2f4;
 
  border-radius: 4px;
 
}
 
kbd {
 
  padding: 2px 4px;
 
  font-size: 90%;
 
  color: #fff;
 
  background-color: #333;
 
  border-radius: 3px;
 
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25);
 
}
 
pre {
 
  display: block;
 
  padding: 9.5px;
 
  margin: 0 0 10px;
 
  font-size: 13px;
 
  line-height: 1.428571429;
 
  color: #333;
 
  word-break: break-all;
 
  word-wrap: break-word;
 
  background-color: #f5f5f5;
 
  border: 1px solid #ccc;
 
  border-radius: 4px;
 
}
 
pre code {
 
  padding: 0;
 
  font-size: inherit;
 
  color: inherit;
 
  white-space: pre-wrap;
 
  background-color: transparent;
 
  border-radius: 0;
 
}
 
.pre-scrollable {
 
  max-height: 340px;
 
  overflow-y: scroll;
 
}
 
.container {
 
  padding-right: 15px;
 
  padding-left: 15px;
 
  margin-right: auto;
 
  margin-left: auto;
 
}
 
@media (min-width: 768px) {
 
  .container {
 
    width: 750px;
 
  }
 
}
 
@media (min-width: 992px) {
 
  .container {
 
    width: 970px;
 
  }
 
}
 
@media (min-width: 1200px) {
 
  .container {
 
    width: 1170px;
 
  }
 
}
 
.container-fluid {
 
  padding-right: 15px;
 
  padding-left: 15px;
 
  margin-right: auto;
 
  margin-left: auto;
 
}
 
.row {
 
  margin-right: -15px;
 
  margin-left: -15px;
 
}
 
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
 
  position: relative;
 
  min-height: 1px;
 
  padding-right: 15px;
 
  padding-left: 15px;
 
}
 
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
 
  float: left;
 
}
 
.col-xs-12 {
 
  width: 100%;
 
}
 
.col-xs-11 {
 
  width: 91.66666666666666%;
 
}
 
.col-xs-10 {
 
  width: 83.33333333333334%;
 
}
 
.col-xs-9 {
 
  width: 75%;
 
}
 
.col-xs-8 {
 
  width: 66.66666666666666%;
 
}
 
.col-xs-7 {
 
  width: 58.333333333333336%;
 
}
 
.col-xs-6 {
 
  width: 50%;
 
}
 
.col-xs-5 {
 
  width: 41.66666666666667%;
 
}
 
.col-xs-4 {
 
  width: 33.33333333333333%;
 
}
 
.col-xs-3 {
 
  width: 25%;
 
}
 
.col-xs-2 {
 
  width: 16.666666666666664%;
 
}
 
.col-xs-1 {
 
  width: 8.333333333333332%;
 
}
 
.col-xs-pull-12 {
 
  right: 100%;
 
}
 
.col-xs-pull-11 {
 
  right: 91.66666666666666%;
 
}
 
.col-xs-pull-10 {
 
  right: 83.33333333333334%;
 
}
 
.col-xs-pull-9 {
 
  right: 75%;
 
}
 
.col-xs-pull-8 {
 
  right: 66.66666666666666%;
 
}
 
.col-xs-pull-7 {
 
  right: 58.333333333333336%;
 
}
 
.col-xs-pull-6 {
 
  right: 50%;
 
}
 
.col-xs-pull-5 {
 
  right: 41.66666666666667%;
 
}
 
.col-xs-pull-4 {
 
  right: 33.33333333333333%;
 
}
 
.col-xs-pull-3 {
 
  right: 25%;
 
}
 
.col-xs-pull-2 {
 
  right: 16.666666666666664%;
 
}
 
.col-xs-pull-1 {
 
  right: 8.333333333333332%;
 
}
 
.col-xs-pull-0 {
 
  right: 0;
 
}
 
.col-xs-push-12 {
 
  left: 100%;
 
}
 
.col-xs-push-11 {
 
  left: 91.66666666666666%;
 
}
 
.col-xs-push-10 {
 
  left: 83.33333333333334%;
 
}
 
.col-xs-push-9 {
 
  left: 75%;
 
}
 
.col-xs-push-8 {
 
  left: 66.66666666666666%;
 
}
 
.col-xs-push-7 {
 
  left: 58.333333333333336%;
 
}
 
.col-xs-push-6 {
 
  left: 50%;
 
}
 
.col-xs-push-5 {
 
  left: 41.66666666666667%;
 
}
 
.col-xs-push-4 {
 
  left: 33.33333333333333%;
 
}
 
.col-xs-push-3 {
 
  left: 25%;
 
}
 
.col-xs-push-2 {
 
  left: 16.666666666666664%;
 
}
 
.col-xs-push-1 {
 
  left: 8.333333333333332%;
 
}
 
.col-xs-push-0 {
 
  left: 0;
 
}
 
.col-xs-offset-12 {
 
  margin-left: 100%;
 
}
 
.col-xs-offset-11 {
 
  margin-left: 91.66666666666666%;
 
}
 
.col-xs-offset-10 {
 
  margin-left: 83.33333333333334%;
 
}
 
.col-xs-offset-9 {
 
  margin-left: 75%;
 
}
 
.col-xs-offset-8 {
 
  margin-left: 66.66666666666666%;
 
}
 
.col-xs-offset-7 {
 
  margin-left: 58.333333333333336%;
 
}
 
.col-xs-offset-6 {
 
  margin-left: 50%;
 
}
 
.col-xs-offset-5 {
 
  margin-left: 41.66666666666667%;
 
}
 
.col-xs-offset-4 {
 
  margin-left: 33.33333333333333%;
 
}
 
.col-xs-offset-3 {
 
  margin-left: 25%;
 
}
 
.col-xs-offset-2 {
 
  margin-left: 16.666666666666664%;
 
}
 
.col-xs-offset-1 {
 
  margin-left: 8.333333333333332%;
 
}
 
.col-xs-offset-0 {
 
  margin-left: 0;
 
}
 
 
}
 
 
}
 
 
 
 
 
 
 
 
</style>
 
</style>
 
+
<body style="background-color: #fff;">
 
+
<div>
 
+
    <!-- Header -->
 
+
  <div class="cam-container">
 
+
    <header class="intro-header" style="background: url(//2017.igem.org/wiki/images/2/27/TeamYork-TemporaryBackground.png); background-size: 100%; background-position:0px 20px;">
<!DOCTYPE html>
+
        <div class="container">
<h5>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse vestibulum arcu ultricies nulla volutpat interdum. Donec quis eros ut felis elementum facilisis eu sed leo. Nam faucibus volutpat mauris at ultrices. Aliquam iaculis est ut ante finibus convallis. Phasellus ac risus ac neque vulputate imperdiet. Interdum et malesuada fames ac ante ipsum primis in faucibus. Maecenas semper eget lacus eu vehicula. Mauris a lacinia risus. Mauris faucibus mi ligula, sit amet interdum urna tempor ut. Aliquam in venenatis nisi, ac feugiat sem. Sed accumsan ultricies leo, quis dictum dolor eleifend in.  
+
            <div class="intro-message text-center container">
 +
                <br style = “line-height:20px;”><br>
 +
                <h1 style="-webkit-text-stroke: 2px black; color:#fff;">Test Bed</h1>
 +
                <h1 style="-webkit-text-stroke: 2px black; color:#fff;">Testing HTML, CSS & JS</h1>
 +
            </div>
 +
        </div>
 +
    </header>
 +
  </div>
 +
</div>
 +
<!--<section id="sidebar" class="navbar-fixed navbar-left">
 +
  <ul style="list-style: none;">
 +
    <span style="color: #999;">
 +
    <li><a style="color: #444;" href="#week1">Week 1</a></li>
 +
    <li><a style="color: #444;" href="#week2">Week 2</a></li>
 +
    <li><a style="color: #444;" href="#week3">Week 3</a></li>
 +
    <li><a style="color: #444;" href="#week4">Week 4</a></li>
 +
    <li><a style="color: #444;" href="#week5">Week 5</a></li>
 +
    <li><a style="color: #444;" href="#week6">Week 6</a></li>
 +
    <li><a style="color: #444;" href="#week7">Week 7</a></li>
 +
    <li><a style="color: #444;" href="#week8">Week 8</a></li>
 +
    <li><a style="color: #444;" href="#week9">Week 9</a></li>
 +
    <li><a style="color: #444;" href="#week10">Week 10</a></li>
 +
    <li><a style="color: #444;" href="#week11">Week 11</a></li>
 +
    <li><a style="color: #444;" href="#week12">Week 12</a></li>
 +
    <li><a style="color: #444;" href="#week13">Week 13</a></li>
 +
    <li><a style="color: #444;" href="#week14">Week 14</a></li>
 +
    <li><a style="color: #444;" href="#week15">Week 15</a></li>
 +
    </span>
 +
  </ul>
 +
</section>-->
 +
<!--Page Content-->
 +
<div class="container">
 +
  <h5>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse vestibulum arcu ultricies nulla volutpat interdum. Donec quis eros ut felis elementum facilisis eu sed leo. Nam faucibus volutpat mauris at ultrices. Aliquam iaculis est ut ante finibus convallis. Phasellus ac risus ac neque vulputate imperdiet. Interdum et malesuada fames ac ante ipsum primis in faucibus. Maecenas semper eget lacus eu vehicula. Mauris a lacinia risus. Mauris faucibus mi ligula, sit amet interdum urna tempor ut. Aliquam in venenatis nisi, ac feugiat sem. Sed accumsan ultricies leo, quis dictum dolor eleifend in.  
 
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus tempor, enim quis rutrum scelerisque, tortor tortor scelerisque ipsum, at ornare metus elit non ipsum. Duis et justo metus. Vivamus fermentum, augue id fringilla viverra, odio mauris scelerisque mauris, vel molestie dolor eros eget lectus. Aliquam accumsan ornare eros, in rhoncus mauris rhoncus in. Pellentesque eleifend sem ut nibh interdum, vitae euismod dolor dictum. Nunc non metus elementum, imperdiet justo at, molestie odio. Aliquam auctor vel risus sed efficitur. Quisque sagittis ac diam id malesuada. Sed sit amet interdum leo.  
 
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus tempor, enim quis rutrum scelerisque, tortor tortor scelerisque ipsum, at ornare metus elit non ipsum. Duis et justo metus. Vivamus fermentum, augue id fringilla viverra, odio mauris scelerisque mauris, vel molestie dolor eros eget lectus. Aliquam accumsan ornare eros, in rhoncus mauris rhoncus in. Pellentesque eleifend sem ut nibh interdum, vitae euismod dolor dictum. Nunc non metus elementum, imperdiet justo at, molestie odio. Aliquam auctor vel risus sed efficitur. Quisque sagittis ac diam id malesuada. Sed sit amet interdum leo.  
 
Proin molestie hendrerit ex, vel vulputate sapien semper in. Vestibulum blandit turpis justo, eget faucibus arcu vehicula ac. Curabitur sit amet purus pretium, dignissim risus a, pharetra lorem. Pellentesque metus tellus, consectetur vel tincidunt ut, varius vel dolor. Morbi at turpis suscipit, viverra diam sit amet, scelerisque odio. Duis laoreet sem posuere, rhoncus tellus quis, gravida leo. In imperdiet venenatis massa nec semper. Vestibulum sit amet scelerisque neque. Duis convallis ultricies justo, id faucibus lacus porttitor nec. Ut ornare nisi vel nunc vestibulum, et maximus dolor porttitor.  
 
Proin molestie hendrerit ex, vel vulputate sapien semper in. Vestibulum blandit turpis justo, eget faucibus arcu vehicula ac. Curabitur sit amet purus pretium, dignissim risus a, pharetra lorem. Pellentesque metus tellus, consectetur vel tincidunt ut, varius vel dolor. Morbi at turpis suscipit, viverra diam sit amet, scelerisque odio. Duis laoreet sem posuere, rhoncus tellus quis, gravida leo. In imperdiet venenatis massa nec semper. Vestibulum sit amet scelerisque neque. Duis convallis ultricies justo, id faucibus lacus porttitor nec. Ut ornare nisi vel nunc vestibulum, et maximus dolor porttitor.  
 
Aliquam gravida velit quis turpis hendrerit, eu fermentum enim cursus. Vivamus sed fermentum arcu. In nec erat in turpis lacinia lacinia. Quisque a erat in metus aliquam tristique. Quisque venenatis quis purus vel accumsan. Etiam sit amet molestie nulla, nec pulvinar tortor. Suspendisse potenti. Nullam pulvinar ullamcorper lorem at scelerisque. Fusce commodo purus non pulvinar hendrerit. Pellentesque rhoncus ac felis nec tempus. Fusce sit amet congue massa.  
 
Aliquam gravida velit quis turpis hendrerit, eu fermentum enim cursus. Vivamus sed fermentum arcu. In nec erat in turpis lacinia lacinia. Quisque a erat in metus aliquam tristique. Quisque venenatis quis purus vel accumsan. Etiam sit amet molestie nulla, nec pulvinar tortor. Suspendisse potenti. Nullam pulvinar ullamcorper lorem at scelerisque. Fusce commodo purus non pulvinar hendrerit. Pellentesque rhoncus ac felis nec tempus. Fusce sit amet congue massa.  
 
Sed dolor quam, venenatis eget orci in, interdum vulputate sem. Morbi tortor arcu, placerat eu rhoncus viverra, rhoncus et risus. Nam non consequat urna, vitae mattis nibh. Donec a ornare diam, vel tincidunt lacus. Morbi in egestas felis, vel venenatis magna. Nulla dolor sapien, consequat et malesuada eget, porta et nibh. Pellentesque volutpat arcu eu ex venenatis, id gravida lectus sodales. Quisque in posuere quam. Proin porttitor gravida ex, ut ultricies eros consequat id. Praesent eget mi eros. </h5>
 
Sed dolor quam, venenatis eget orci in, interdum vulputate sem. Morbi tortor arcu, placerat eu rhoncus viverra, rhoncus et risus. Nam non consequat urna, vitae mattis nibh. Donec a ornare diam, vel tincidunt lacus. Morbi in egestas felis, vel venenatis magna. Nulla dolor sapien, consequat et malesuada eget, porta et nibh. Pellentesque volutpat arcu eu ex venenatis, id gravida lectus sodales. Quisque in posuere quam. Proin porttitor gravida ex, ut ultricies eros consequat id. Praesent eget mi eros. </h5>
 +
</div>
 +
<section>
 +
  <div class="container">
 +
    <div class="row text-center"> 
 +
      <div class="col-md-4">
 +
        <center class="TeamImg1">
 +
          <img id="TeamImg1" class="TeamImg" style="height: 475px; width: 375px; position: center; object-fit: cover;" src="https://static.igem.org/mediawiki/2017/d/d4/TeamYork-Headshots-Sam1.jpg" width="100%" height="100%">
 +
          <span id="TeamImg1Text">Sam F: a proud member of Homo cynicus.</span>
 +
        </center>
 +
      </div>
 +
      <div class="col-md-4">
 +
        <center class="TeamImg2">
 +
          <img id="TeamImg2" class="TeamImg" style="height: 475px; width: 375px; position: center; object-fit: cover;"
 +
src="https://static.igem.org/mediawiki/2017/f/f9/TeamYork-Headshots-Sam2.jpg" width="100%" height="100%">
 +
          <span id="TeamImg2Text">Sam A: likes to pretend he's only half German... but look at him.</span>
 +
        </center>
 +
      </div>
 +
      <div class="col-md-4">
 +
        <center class="TeamImg3">
 +
          <img id="TeamImg3" class="TeamImg" style="height: 475px; width: 375px; position: center; object-fit: cover;" src="https://static.igem.org/mediawiki/2017/d/d0/TeamYork-Headshots-Helen.jpg" width="100%" height="100%">
 +
          <span id="TeamImg3Text">Helen: loud and proud. Mostly loud.</span>
 +
        </center>
 +
      </div>
 +
    </div>
 +
  </div>
 +
</section>
  
 
</html>
 
</html>
 +
{{:Team:York/Templates/Footer}}

Latest revision as of 13:04, 12 September 2017



Test Bed

Testing HTML, CSS & JS

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse vestibulum arcu ultricies nulla volutpat interdum. Donec quis eros ut felis elementum facilisis eu sed leo. Nam faucibus volutpat mauris at ultrices. Aliquam iaculis est ut ante finibus convallis. Phasellus ac risus ac neque vulputate imperdiet. Interdum et malesuada fames ac ante ipsum primis in faucibus. Maecenas semper eget lacus eu vehicula. Mauris a lacinia risus. Mauris faucibus mi ligula, sit amet interdum urna tempor ut. Aliquam in venenatis nisi, ac feugiat sem. Sed accumsan ultricies leo, quis dictum dolor eleifend in. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus tempor, enim quis rutrum scelerisque, tortor tortor scelerisque ipsum, at ornare metus elit non ipsum. Duis et justo metus. Vivamus fermentum, augue id fringilla viverra, odio mauris scelerisque mauris, vel molestie dolor eros eget lectus. Aliquam accumsan ornare eros, in rhoncus mauris rhoncus in. Pellentesque eleifend sem ut nibh interdum, vitae euismod dolor dictum. Nunc non metus elementum, imperdiet justo at, molestie odio. Aliquam auctor vel risus sed efficitur. Quisque sagittis ac diam id malesuada. Sed sit amet interdum leo. Proin molestie hendrerit ex, vel vulputate sapien semper in. Vestibulum blandit turpis justo, eget faucibus arcu vehicula ac. Curabitur sit amet purus pretium, dignissim risus a, pharetra lorem. Pellentesque metus tellus, consectetur vel tincidunt ut, varius vel dolor. Morbi at turpis suscipit, viverra diam sit amet, scelerisque odio. Duis laoreet sem posuere, rhoncus tellus quis, gravida leo. In imperdiet venenatis massa nec semper. Vestibulum sit amet scelerisque neque. Duis convallis ultricies justo, id faucibus lacus porttitor nec. Ut ornare nisi vel nunc vestibulum, et maximus dolor porttitor. Aliquam gravida velit quis turpis hendrerit, eu fermentum enim cursus. Vivamus sed fermentum arcu. In nec erat in turpis lacinia lacinia. Quisque a erat in metus aliquam tristique. Quisque venenatis quis purus vel accumsan. Etiam sit amet molestie nulla, nec pulvinar tortor. Suspendisse potenti. Nullam pulvinar ullamcorper lorem at scelerisque. Fusce commodo purus non pulvinar hendrerit. Pellentesque rhoncus ac felis nec tempus. Fusce sit amet congue massa. Sed dolor quam, venenatis eget orci in, interdum vulputate sem. Morbi tortor arcu, placerat eu rhoncus viverra, rhoncus et risus. Nam non consequat urna, vitae mattis nibh. Donec a ornare diam, vel tincidunt lacus. Morbi in egestas felis, vel venenatis magna. Nulla dolor sapien, consequat et malesuada eget, porta et nibh. Pellentesque volutpat arcu eu ex venenatis, id gravida lectus sodales. Quisque in posuere quam. Proin porttitor gravida ex, ut ultricies eros consequat id. Praesent eget mi eros.
Sam F: a proud member of Homo cynicus.
Sam A: likes to pretend he's only half German... but look at him.
Helen: loud and proud. Mostly loud.