/* CSS Document */
html,body{/*Always use margin:  0;  padding:  0;, affects the entire page, setting both to 0 ensures that page will spread to the outer edges of the browser window, otherwise there would be a space all the way around the layout.*/
    margin:0;padding:0;
}
p {
    margin:0 5px 10px
}
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 80%;
	text-align:justify;
	
}
#container {
	width: 100%;
	margin: 0; /* changed from 1em 5% */
}
#banner {
	width:100%;
	height:auto;
	overflow:hidden;
}
#banner video {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}
#pagebkgrd {
	background-image: url(Images/fg_bg.jpg);
	background-repeat: repeat-x;
}
#wrapper {
	width: 700px;
	margin:0 auto;
}	
#nav_container {
	float: left;
	width: 200px;
	margin-top: 20px;
}
#content {
	float: right;
	width: 500px;
	line-height: 1.4em;
	margin-top:20px;
}
#word-tooltip {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 10000;
	width: 220px;
	padding: 3px;
	font-size: 11px;
	line-height: 1.2;
	background-color: #79aee4;
	border: 1px solid #336;
	visibility: hidden;
	opacity: 0;
	clip-path: inset(0 100% 0 0);
	transition: clip-path 300ms ease, opacity 300ms ease, visibility 0s linear 300ms;
}
#word-tooltip.is-visible {
	visibility: visible;
	opacity: 1;
	clip-path: inset(0 0 0 0);
	transition: clip-path 300ms ease, opacity 300ms ease;
}
.welcome {
	font-family: "Lucida Calligraphy";
	font-size: 18px;
	letter-spacing:0.10em;
	line-height: 13px;
	color: #000000;
}
.pleasenote {
	font-size: 14px;
	font-weight: bold;
	font-style: italic;
}
#extra {
	background-color: #ff8539;
	float: right;
	width: 500px;
	
}
#footer p {
	margin: 0;
	padding:5px 10px
}


#footer {
    margin-top:10px;
    text-align:center;
	color: #FFFFFF;
	background-color: #6ea1ec;
	clear: both;
	width: 100%;
}

#footer a 
     {
color: #ffcc28;
}   
#footer a:hover {
color: #2268c3;
}