body {background-color: #040c1f; margin: 0px; font-family: Arial, Helvetica, sans-serif; font-size: 12pt; color: #ccc; }
#tbLogo { text-align: center; width: 100%; }
#maindiv { width: 100%; position: relative; background-color: transparent; margin-bottom: 16px; }
#tbLogo img { height: 50%; margin-bottom: 10px;  }

* { box-sizing: border-box; }
div, article { float: left; position: relative; }
h2 {margin-top: 0; margin-bottom: 8pt; color: #ccc; }
p {margin-bottom: 0; margin-top: 0; color: #aaa; }
a { color: #ddd; text-decoration: none; }
li { margin-bottom: 0.5em;}
.wi { margin-left: 2em; }

article { width: 100%; padding: 10px; min-height: 175px; border-radius: 0.5em; border: thin solid #aaa; color: #aaa; }
article img { width: 80px; float: left; margin-right: 10px; }

.ds { width: 100%; padding: 10px; color: #aaa; }

.footer { width: 100%; display: block; }
footer { padding: 10px; color: #888; font-size: 10pt; text-align: center; width: 100%; display: block; }
footer a { color: ddd; }


@media (min-width: 980px) {
	#maindiv { left: 50%; width: 980px; margin-left: -490px; }
	.wr { width: 33.3%; min-width: 270px; padding: 10px; }
}

@media (min-width: 830px) AND (max-width: 979px) {
	.wr { width: 33.3%; min-width: 270px; padding: 10px; }
}

@media (min-width: 560px) AND (max-width: 829px) {
	.wr { width: 50%; min-width: 270px; padding: 10px; }
}

@media (max-width: 559px) {
	.wr { width: 100%; padding: 10px; }
	#tbLogo img { width: 100%; }
}