html {
 background: url("image/website-01.png");
 background-repeat:repeat-y;
 background-position: center top;
}

p {
  font: 1em; 
  font-family:"Raleway" , "Times New Roman" Georgia serif;
  color: 666;
}

body {
  margin: 15% auto;
  width: 75% ;
}

p {
  line-height: 1em;
  margin-width: auto;
  margin-left: 40% ;
  margin-top: 5% ;
}

h1 {
  font-size: .8em;
  position: fixed;
  top: 60%;
  left: 24%;
  color: grey;
  font-family: "Open Sans", Helvetica, sans-serif;
}

h2 {
  font-size: 3em;
  color: #555;
  line-height: 1em;
  margin-width: auto;
  margin-left: 40% ;
}
h3 {
  font-size: 3em;
  color: #555;
  line-height: 1em;
  margin-width: auto;
}
h4  {
  font-size:.8em;
  line-height: 1.5em;
  margin-width: auto;
  margin-left: 40% ;
}
h6 {
  font-size: 1.8em;
  color: orange;
  line-height: 1em;
  margin-width: auto;
  margin-left: 40% ;
}

ul { 
  margin-left: 36%;
  font-family:"Raleway" , "Times New Roman" Georgia serif;
}

a {
  font-size: 1em;
  text-decoration: none;
  color: teal;
  font-family: "Open Sans", Helvetica, sans-serif;
}
a:hover {
  color: orange;
}

img { 
  margin-left: 40%;
  }

h5{
<--! fixed leftmargin for  logo image -->
  float: left;
  position: fixed;
  margin-left: 10%;
  margin-top: -17%;
}
video { 
  float: right;
  margin-left: 40%;
  margin-top: 20%;
  width: 60%
}

<style>
  #feedback { font-size: 1em; }
  #timeline {list-style-type: none; margin: 40%; padding: 0; width: 60%;}
  #selectable .ui-selecting { background: #FECA40; }
  #selectable .ui-selected { background: #F39814; color: white; }
  #selectable { list-style-type: none; margin-left: 40%; padding: 0; width: 60%; }
  #selectable li { margin: 3px; padding: 0.4em; font-size: 1em; height: 18px; }
  </style>
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
  $( function() {
    $( "#selectable" ).selectable();
  } );
  </script>