/* Set height to 100% for body and html to enable the background image to cover the whole page: */
body, html{height:100%}

.center{
    height:100%; 
    position:relative;
    color:black;
    font-family:"Courier New", Courier, monospace;
    font-size:25px;}

.top{    
    position:absolute;
    top:20px;
    left:50%;
    transform:translate(-50%, -70%);
    text-align:center;
    margin-top:20px;
    padding:0px;
    width:90%;}
.top p.left{float:left;}
.top p.right{float:right;}

.bottom {
    position:absolute;
    bottom:0;
    left:50%;
    transform:translate(-50%, -0%);
    text-align:center;
    width:90%;}
.bottom p.left{float:left;}
.bottom p.right{float:right}

.middle{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    text-align:center;}
hr{margin:auto;width:70%;}

*{box-sizing:border-box;}