
/* I would like to point out that my HTML skills are incredibly basic. 
So I made extensive use of the huge amount of on-line coding resources provided by W3schools (https://www.w3schools.com) */


/* defining some common styles */
body {
  background: #bbb340; font: 300 30px "Arial", sans-serif; margin: 0
}

h1 {font-size: 4vw; color: #3e5a24; background-color: #ffffff; margin: 0;}
h2 {margin-left: 25px;font: 300 50px "Arial", sans-serif; }
h3 {margin-left: 25px;font: 300 40px "Arial", sans-serif; }

p.indent { margin-left: 25px; margin-right: 20px; }
p.big { font-size: 45px; margin-left: 25px; margin-right: 20px; }


.centre {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 60%;
}

.xmas {
 text-align: center; font-family:Copperplate, Fantasy; font-size:60px; color:rgb(255,255,0)
}

td, th {
vertical-align:top;
}

/* test 1/6/23
ul.indent {list-style-type: disc;  margin-left: 150px; margin-right: 20px; }
li.indent {list-style-type: disc; }
*/

.one {
	list-style: circle;
}


/*Floating Back-To-Top Button*/
    #myBtn {
        position: fixed;
        bottom: 10px;
        float: right;
        right: 10%;
        left: 90%;
        max-width: 120px;
        width: 100%;
        font-size: 20px;
        border-color: rgba(85, 85, 85, 0.2);
        background-color: rgb(100,100,100);
        padding: .5px;
        border-radius: 4px;

    }
/*On Hover Color Change*/
    #myBtn:hover {
        background-color: #7dbbf1;
    }




/* in amongst this code it prevents a gap between the header and the menu */

html,body,blockquote,code,h1,h2,h3,h4,h5,h6,p,pre{margin:5;padding:5}
button,fieldset,form,input,legend,textarea,select{margin:5;padding:5}
fieldset{border:0}
a,a *{cursor:pointer}
div{margin:0;padding:0;background-color:transparent;text-align:left}
hr,img{border:0}
applet,iframe,object{border:0;margin:0;padding:0}
button,input[type=button],input[type=image],input[type=reset],input[type=submit],label{cursor:pointer;}
ul,li{list-style:none;margin:0;padding:0;}
strong{font-weight:bold;}
em{font-style:italic;} 



/* the nav-bar code was copied from webdevtrick ( https://webdevtrick.com ) */
 
#menu-nav {
  max-width: 2000px;
  margin: 0 ;
  background-color: #3e5a24;
  border-radius: 0;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.3);
}
 
#navigation-bar ul {
  border-radius: 0;
  overflow: hidden;
}
#navigation-bar li {
  float: left;
  width: 16%;
}
#navigation-bar li:hover a::before {
  right: 0;
  left: 0;
}
#navigation-bar a {
  color: #ffffff;
  font-size: 20px;
  text-decoration: none;
  text-align: center;
  padding: 10px 0;
  display: block;
  position: relative;
  transition: all 0.3s ease;
}
#navigation-bar a:hover {
  color: #e74c3c;
}
#navigation-bar a::before {
  content: "";
  transition: all 0.4s ease-in-out;
  position: absolute;
  right: 50%;
  left: 50%;
  bottom: 0;
  height: 3px;
  background-color: #e74c3c;
}
#navigation-bar a:hover::before {
  right: 0;
  left: 0;
}
 
li {
	list-style: none;
}



<!-- END OF FILE -->

