html, body {
    height: 100%;
}

body {
    padding-top: 55px;
    display: flex;
    text-align: center;
    flex-direction: column;
}

main {
    margin: auto;
    padding: 25px;
    flex: 1 0 auto;
    max-width: 750px;
}

/*footer*/

.copyright {
    margin: 15px 0;
}

/*home page*/

.intro {
    transform: translateY(8vh);
}

.intro > h1 {
    color: #212121;
    font-size: 8vh;
    border:none;
}

.intro > h2 {
    color: #757575;
    font-size: 3vmin;
    border:none;
}

.intro > .profile {
    width: 200px;
    box-shadow: 5px 5px 5px #ffffff;
    margin-bottom:0;
}

/*apply accent colour to links*/

a:link, a:visited {
    color: var(--accent);
}

a.icon:hover {
    text-decoration: none;
}

a:hover {
    color: var(--accent) !important;
}

p{
  line-height: 1.7em
}

/*paginator at bottom of list view*/

.pages {
    padding: 15px 0;
}

.pages-icon {
    padding: 0 15px;
}

.page-header{
 border:none;
}

/*list item for posts and projects*/

.item {
    padding: 10px 0;
}

.item-tag {
    background-color: var(--accent);
}

/*navigation bar icons*/

.navbar-icon {
    font-size: 125%;
    display: inline-block !important;
}

/*coloured borders at top and bottom of the page*/

.navbar.navbar-default {
    border-top: var(--border-width) solid var(--accent);
}

footer {
    border-bottom: var(--border-width) solid var(--accent);
}

p:has(img) {
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}

img{
  max-width: 100%;
  padding: 20px;
  box-shadow: 5px 5px 5px #cfcfcf;
  margin-bottom:30px;}

/* my css */

h1,h2,h3,h4,h5,h6{
 border-left:3px solid #16ac00;
 padding-left:5px;
 padding-top: 10px;
 padding-bottom: 10px;
}

.bordernone{
 border:none;
}

.redc{
 color:red;
}

.bluec{
 color:blue;
}

.greenc{
  color:green;
}

.lyellowc{
 color:lightyellow;
}

.whitec{
 color:white;
}

.centerd{
 text-align:center;
 margin: 0 auto;
}

.centerd img{
 width: 100px;
 box-shadow: 5px 5px 5px #ffffff;
 margin-bottom:0;
}

table{
 width:100%;
 padding:20px;
 table-layout:auto;
 border-collapse:collapse;
 margin-bottom:30px;
}

thead{
 background:gold;
 color:white;
}

thead th{
 text-align:center; 
}

tbody tr:nth-child(2n){
  background:lightyellow;
}

th,td{
 border:1px solid #cfcfcf;
}

.sizemiddle{
  width: 90%;
}

.adsense{
  margin-top:50px;
  margin-bottom:20px;
  padding-top:10px;
  padding-bottom:10px;
  border:1px solid grey;
  width:100%;
}

.figlink{
 width:100%;
 text-align:center;
 margin:0 auto;
}
.figlink>a>div{
 width: 50%;
 text-align:center;
 margin:0 auto;
}
.figlink>a>div>p{
 color:black;
 font-size: 15pt;
}
.figlink img{
 width: 200px;
 margin-right: 20px;
}