@import url('https://fonts.googleapis.com/css2?family=Ubuntu&display=swap');

body {
  background: #cce4e6;
  color: #12282f;
  font-family: 'Ubuntu', sans-serif;
  font-size:15px;
  line-height: 2;
  }
  
center {
  text-align: center;
  }
  
.wrapper {
  /*1600 - 1000 = 600
  
  1050 - 200 = 850
  850 - 200 = 650
  650 - 10 - 10 - 10 = 620
  
  position: absolute;*/
  width: 1150px;
  background: #aad2d4;
  margin: 0 auto;
  /*margin-left: 300px;*/
  top: 0;
  margin-top: -10px;
  border: 4px solid #8bbec1;
  margin-bottom: -10px;
  }
  
.header, .footer {
  height: 200px;/*
  border: 1px solid red;*/
  overflow: hidden;
  
  border-bottom: 5px solid #aad2d4;
  }
  
.footer {height: 50px;}
  
.header img, .footer img {
  width: 1140px;
  display: inline-block;
  opacity: 0.9;
  border: 5px solid #aad2d4;
  }
  
.header img {
  border-top: 0px;
  }
  
.title {
  border: 0px solid green;
  padding: 5px;
  padding-left: 25px;
  padding-top: 20px;
  font-weight: bold;
  font-size: 40px;
  }
  
.subtitle {
  color: #446e70;
  border: 0px solid green;
  padding: 10px;
  padding-left: 25px;
  padding-top: 0px;
  padding-bottom: 15px;
  font-size: 30px;
  }
  
h3 {
  color: #446e70;
  }

.links {
  border: 0px solid green;
  padding: 15px;
  padding-top: 3px;
  padding-bottom: 5px;
  }
  
.link {
  text-align: center;
  display: inline-block;
  list-style-type: none;
  float: none;
  font-weight: bold;
  font-size: 16px;
  padding: 5px;
  margin-right: 10px;
  margin-left: 10px;
  border: 0px solid red;
  }
  
.link a {
  color: white;
  text-decoration: none;
  }

.sidebar-left { 
  background: #cce4e6;
  color: #12282f;
  border-top: 5px solid #8bbec1;
  border-bottom: 5px solid #8bbec1;
  width: 157px;
  padding: 20px;
  padding-top: 0px;
  margin-left: 10px;
  display: inline-block;
  position: absolute;
  }
  
.main {
  background: #cce4e6;
  color: #12282f;
  display: inline-block;
  margin-left: 20px;
  padding: 5px;
  padding-left: 25px;
  padding-right: 25px;
  width: 800px;
  border-top: 5px solid #8bbec1;
  border-bottom: 5px solid #8bbec1;
  }
  
hr {
  width: 100%;
  padding-left: 25px;
  padding-right: 25px;
  border-top: 5px solid #8bbec1;
  border-bottom: 5px solid #8bbec1;
  background: #aad2d4;
  height: 20px;
  margin-top: 30px;
  margin-left: -26px;
  border-left: 1px solid #aad2d4;
  border-right: 1px solid #aad2d4;
  }
  
.sidebar-right {
  background: #cce4e6;
  color: #12282f;
  border-top: 5px solid #8bbec1;
  border-bottom: 5px solid #8bbec1;
  width: 160px;
  padding: 25px;
  padding-top: 0px;
  margin-right: 10px;
  display: inline-block;
  position: absolute;
  margin-left: 27px;
  }
  
.wrapper-2 {
  border: 0px solid green;
  position: relative;
  padding: 15px;
  }
  
.content {
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 0px;
  padding-bottom: 35px;
  }

a {
  color: #446e70;
  text-decoration: none;
  }
  
img {
  max-width: 100%;
  max-height: 100%;
  }
  
.diagram {
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding-top: 30px;
  padding-bottom: 30px;
}

.img-box {
  position: relative;
  margin: 20px;
  margin-top: 40px;
  margin-bottom: 10px;
  width: 120px;
  }

p {
  padding-left: 10px;
  padding-right: 10px;
  }

sup { 
  vertical-align: top; 
  font-size: 0.6em; 
  }

.sidebar-right ul li ul {
    display: none;
    background-color: #d7d7d7
  }

.sidebar-right ul li ul li a.active {
    background-color: initial;
    color: #17629e;
    padding-bottom: initial
  }

code {
  font-family: monospace;
  background: #aad2d4;
  }

#side-indent {
  padding-left: 0px;  
  font-family: monospace;
  }

.sticky {
  position: fixed;
  top: 0;
  width: 160px;
  }

.centre {
  margin-left: auto;
  margin-right: auto;
  }

table, th, td {
   border-collapse: collapse;  
  }

th {
  text-align: left;
  border-bottom: 1px solid black;  
  padding-left: 15px;
  padding-right: 15px;
  }
  
td {
  padding-left: 15px;
  padding-right: 15px;
  }

.button {
  background-color: #cce4e6;
  padding-left: 10px;
  }

.button:hover {
  background-color: #aad2d4;
  }

ol {
  list-style-position: inside;  
  }
