html *{
	font-family: IBm;
/*	cursor: url(sunOpenWindows.cur) 0 0, pointer !important;*/
}
@font-face {
    font-family: IBM;
    src: url("PxPlus_IBM_VGA8.ttf");
}
html *{
	font-family: ProjectX;
}
@font-face {
    font-family: ProjectX;
    src: url("ProjectX_02.5-xyztest.ttf");
}
body {
	background-color:black;
	background-image: url("background4.gif");
}

header {
	display: block;
	margin: auto;
	max-height: 800px;
	max-width: 800px;
}
nav {
	margin: auto;
	max-width: 780px;
	padding-bottom: 5px;
}
.navmisc {
	margin: auto auto auto 30%;
	display: inline-block;
	list-style: none;
	text-align: center;
}
aside {
	float: left;
	width: 169px;
	display: block;
	border: 1px solid white;
	border-radius: 12px;
	background-color: black;
	color: white;
}
.sticky {
  position: -webkit-sticky; /*safari*/
  position: sticky;
  top: 0;
}
.binderSpace {
	margin-left: 172px;
	display: block;
	border: 1px solid red;
	border-radius: 12px;
	padding: 5px;
	background-color: black;

}
img {
	max-width: 100%;
}
main {
	display: block;
	margin: auto;
	max-width: 792px;
}
footer {
	text-align: center;
	color: white;
}
h1 {
	color: white;
	text-align: center;
	font-family: IBM;
}
h2 {
	color: white;
	text-align: center;
	font-family: IBM;
}
p {
	color: white;
	text-align: center;
		font-family: Times;
}
.white {
	color: white;
}
h4 {
	color: White;
	text-align: center;
	font-family: IBM;
}
b {
	color: White;
}

q {

	color: white;
	text-align: center;
	font-family: Times;
	font-style: italic;
}

.contents {
	border: white;
	border-style: dashed;
	border-image: url("contborder.gif") 10 repeat;
	border-width:3px;
	text-align: left;
	color: white;
	width: 163px;
	float: left;
	padding: 0px 0px 30px 0px;
	background: rgba(0, 0, 0, 0.6)
}
/*marquee*/

.marquee {
	width: 100%;
	line-height: 5px;
	white-space: nowrap;
	overflow: hidden;
	box-sizing: border-box;
}
.marquee p {
    display: inline-block;
    padding-left: 100%;
    animation: marquee 20s linear infinite;
}
@keyframes marquee {
    0%   { transform: translate(0, 0); }
    100% { transform: translate(-100%, 0); }
}


/*Table*/

td, th {
    border-style: solid;
    border-width: 4px;
    padding: 0.2em;
    text-align: center;
	vertical-align: middle;
  border-top-color: #8F8F8F;
  border-left-color: #8F8F8F;
  border-right-color: white;
  border-bottom-color: white;
}
table {
	border-style: outset;
	border-width: 4px;
 	border-top-color: white;
	border-left-color: white;
	border-right-color: gainsboro;
 	border-bottom-color: gainsboro;
	border-spacing: 4px;
	border-collapse: separate;
	caption-side: bottom;
	empty-cells: hide;
	width: 100%;
	background-color: lightgrey;
}



/*buttons*/


button {
	background-color: lightgrey;
	padding: 5px 5px 5px 5px;
	vertical-align: top;
	margin: 4px 5px 4px 4px;
	border-width: 5px;
 	border-top-color: white;
	border-left-color: white;
	border-right-color: gainsboro;
 	border-bottom-color: gainsboro;
	width: 90%;
}

button:active {
    margin: 4px 5px 4px 4px;
    background-color: #999999;
	border-color: gainsboro;
}

button:hover {
    	margin: 4px 5px 4px 4px;
	border-color: gainsboro;
	background-color: #999999;
}

/* unvisited link */
a:link {
  color: DodgerBlue;
}

/* visited link */
a:visited {
  color: blueviolet;
}

/* hover link */
a:hover {
  color: AliceBlue;
}

/*Button Navbar*/


ul {
list-style-type:none;
margin:auto;
padding:0;
overflow:hidden;
display: block;
justify-content: center;
}
li.nav {
float: left;
border-bottom: 0;
width: 96px;
}
li.aside {
text-align: center;
border-bottom: 1px solid #555;
}

li {
	text-align: center;
}
span.btn a:link,
span.btn a:visited {
	display: block;
	text-indent: -9999px;
	max-width: 96px;
}

span.about a:link,
span.about a:visited {
	width: 96px;
	height: 56px;
	background: url(../Images/about/navbarIndex.gif) 0px 0px no-repeat;
}
span.about a:hover {
	background-position: -1px -56px;
}
span.about a:active {
	background-position: -6px -50px;
}
span.library a:link,
span.library a:visited {
	width: 96px;
	height: 56px;
	background: url(../Images/about/navbarIndex.gif) -96px 0px no-repeat;
}
span.library a:hover {
	background-position: -97px -56px;
}
span.library a:active {
	background-position: -102px -50px;
}
span.projects a:link,
span.projects a:visited {
	width: 96px;
	height: 56px;
	background: url(../Images/about/navbarIndex.gif) -198px -50px no-repeat;
}
span.projects a:hover {
	background-position: -197px -51px;
}
span.projects a:active {
	background-position: -198px -50px;
}
span.fun a:link,
span.fun a:visited {
	width: 96px;
	height: 56px;
	background: url(../Images/about/navbarIndex.gif) -288px 0px no-repeat;
}
span.fun a:hover {
	background-position: -289px -56px;
}
span.fun a:active {
	background-position: -294px -50px;
}
span.gallery a:link,
span.gallery a:visited {
	width: 96px;
	height: 56px;
	background: url(../Images/about/navbarIndex.gif) -384px 0px no-repeat;
}
span.gallery a:hover {
	background-position: -385px -56px;
}
span.gallery a:active {
	background-position: -390px -50px;
}
span.archive a:link,
span.archive a:visited {
	width: 96px;
	height: 56px;
	background: url(../Images/about/navbarIndex.gif) -480px -0px no-repeat;
}
span.archive a:hover {
	background-position: -481px -56px;
}
span.archive a:active {
	background-position: -486px -50px;
}
span.links a:link,
span.links a:visited {
	width: 96px;
	height: 56px;
	background: url(../Images/about/navbarIndex.gif) -576px 0px no-repeat;
}
span.links a:hover {
	background-position: -577px -56px;
}
span.links a:active {
	background-position: -582px -50px;
}
span.downloads a:link,
span.downloads a:visited {
	width: 96px;
	height: 56px;
	background: url(../Images/about/navbarIndex.gif) -673px 0px no-repeat;
}
span.downloads a:hover {
	background-position: -673px -56px;
}
span.downloads a:active {
	background-position: -678px -50px;
}

/*For lower than 783px width resolutions.*/
@media only screen and (max-width: 783px) {
li.nav {margin-left: -8px;}/*Allows all buttons to be snug next to eachother, saving space*/
button {width: 91.5% !important} /*Evens out all buttnos, similar to how they display by default on links page*/
}