html {
padding: 0;
margin: 0;
min-height: 100%;
background-color: #dddddd;
}
body {
padding: 0;
margin: 0;
background-color: #ffffff;
}
.menu {
background-color: #ffff00;
text-align: center;
padding: 14px;
margin: 0 0 25px 0;
border-bottom: solid 2px #aaaaaa;
}
.menu a {
font: .7em Arial, sans-serif;
font-weight: bold;
letter-spacing: 1px;
color: #000000;
padding: 0 12px;
text-decoration: none;
}
table {
border-collapse: collapse;
margin: 0 auto 25px auto;
padding: 0;
border: solid 2px #aaaaaa;
}
th, td {
text-align: center;
vertical-align: middle;
padding: 4px 14px 2px 16px;
}
th {
font: 1.4em Arial, sans-serif;
background-color: #ffff00;
text-align: center;
font-weight: bold;
letter-spacing: 3px;
}
td {
font: .7em Arial, sans-serif;
text-align: center;
color: #666666;
letter-spacing: 1px;
}
.main-home {
max-width: 75%;
margin: 75px auto;
padding: 0;
background-color: #ffffff;
}
.main {
max-width: 750px;
margin: 75px auto;
padding: 0;
background-color: #ffffff;
}
h2 {
text-align: right;
font-family: sans-serif;
font-weight: bold;
letter-spacing: 2px;
font-size: .8em;
width: 28%;
clear: both;
float: left;
margin: 0;
padding: 0;
}
.display {
margin: 0 0 2em 30%;
padding: 0 0 0 12px;
border-left: solid 2px #aaaaaa;
clear: right;
}
.image {
margin: 60px auto 0 auto;
width: 600px;
max-width: 90%;
text-align: center;
padding: 0;
}
.image img {
width: 100%;
padding: 5px;
border: solid 1px #aaaaaa;
margin: 0;
}
.collage {
text-align: center;
font-size: 0;
padding: 0;
}
.collage a {
margin: 0;
width: 33.33%;
padding: 0 20px 20px 20px;
box-sizing: border-box;
display: inline-block;
min-width: 200px;
}
.collage a img {
background: #ffffff;
padding: 5px;
border: solid 1px #aaaaaa;
max-width: 100%;
box-sizing: border-box;
}
.collage a:hover img {
background: #ffff00;
}
.main p, .main-home p, .main li {
font: .9em Arial, sans-serif;
line-height: 140%;
}
.footer {
clear: left;
background-color: #dddddd;
padding: 10px 0 30px 0;
margin: 0;
text-align: center;
vertical-align: top;
border-top: solid 2px #888888;
}
.footer a {
color: inherit;
text-decoration: none;
}
.footer a:hover {
color: inherit;
text-decoration: underline;
}
@media (min-width: 500px) and (max-width: 749px) {
footer {
width: 500px;
}
}
.column {
width: 250px;
display: inline-block;
padding: 0;
margin: 0;
text-align: left;
vertical-align: top;
}
h3 {
font: .7em Arial, sans-serif;
padding: 10px 0 5px 0;
margin: 0;
font-weight: bold;
letter-spacing: 1px;
}
p strong {
font: .8em Arial, sans-serif;
padding: 10px 0 5px 0;
margin: 0;
font-weight: bold;
letter-spacing: 1px;
}
h4 {
font: .7em Arial, sans-serif;
padding: 20px 0 10px 40px;
margin: 0;
font-weight: bold;
letter-spacing: 1px;
}
.right {
float: right;
display: inline-block;
background: #ffffff;
padding: 5px;
margin: 0 0 0 30px;
border: solid 1px #aaaaaa;
width: 400px;
}
.column p {
font: .7em Arial, sans-serif;
padding: 0 0 0 40px;
margin: 0;
line-height: 1.6em;
}
.close {
clear: both;
}