body {
    background-color: white;
	font-family: Arial; 
    color: black;
	background-image: url(images/tpl.png);
    background-position: center;
    background-repeat: repeat;
	margin:0;
	padding:0;
	height:100%;
	}
  h1 { 	text-align: center;
        font-family: Helvetica; 
	    color: black;
	font-size: 16px}


  h2 {
    font-family: Arial; 
	color: gray;
	font-size: 16px
	}  
	
  h3 { 	text-align: left;
        font-family: Arial; 
	    color: black;
	font-size: 16px}
	
.right {
    float: right;
	padding: 0.1em
	}
	
.center {
    margin: auto;
    width: 800px;
    height: 600px;
    padding: 2%;
}


.footer {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1rem;
  text-align: right;
}
	
a {
    color: BLACK;
}
	
img {
    max-width: 100%;
    height: auto;
}


ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

li {
    float: left;
	
}

li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li a:hover:not(.active) {
    background-color: gray;
}

.active {
    background-color: #333;
}

div.img {
    margin: 5px;
    border: none;
    float: left;
    width: 188px;
}	

div.img:hover {
    border: 0;
}

div.img img {
    width: 100%;
    height: auto;
}

div.desc {
    padding: 15px;
    text-align: center;
}

table.ex1 {
    border-collapse: separate;
    border-spacing: 0px 0px;
}


@keyframes play {
    100% { background-position: -8000px; }
}