@charset "UTF-8";
/* CSS Document */

html, body {
	margin: 0px;
	padding: 0px;
	height: 100%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
}

h2 {
	text-transform: uppercase;
	font-weight: bold;
	font-size: 18px;
	color: #3399CC;
	line-height: 18px;
	border:dashed;
	border-color:#CCC;
	border-width:thin;
	text-align:center;
}

h2 span {
	text-transform: lowercase;
	color: #666;
	font-size:14px;
	line-height: 8px;
}

h3 {
	color: #666;
	font-size: 20px;
	line-height:18px;
	text-transform: uppercase;
}

span {
	color: #3399CC;
	font-size:20px;
	line-height: 18px;
}

.info {
	padding: 10px;
}

#container {
	width: 975px;
	height: 100%;
	margin: auto;
}

#content {
	width: 975px;
	height: 620px;
	background-color:#3399CC;
	margin: auto;
	top: 20px;
	position: relative;
}

#titlea {
	background-image:url(images/web_title_a.png);
	width: 960px;
	height: 130px;
	position: absolute;
	left: 10px;
	top: 245px;
	visibility: visible;
}

#titleb {
	background-image:url(images/web_title_b.png);
	width: 960px;
	height: 130px;
	position: absolute;
	left: 10px;
	top: 245px;
	visibility: hidden;
}

#box1 {
	width: 235px; height: 235px; position: absolute;
	left: 10px;
	top: 10px;
	background-image:url(images/web_screenshot_09.jpg);
	visibility: visible;
}

#desc1 {
	width: 215px; height: 215px; position: absolute;
	left: 10px;
	top: 10px;
	background-color:#FFF;
	visibility: hidden;
}


#box2 {
	width: 235px; height: 235px; position: absolute;
	left: 250px;
	top: 10px;
	background-image:url(images/web_screenshot_02.jpg);
	visibility: visible;
}

#desc2 {
	width: 215px; height: 215px; position: absolute;
	left: 250px;
	top: 10px;
	background-color:#FFF;
	visibility: hidden;
}


#box3 {
	width: 235px; height: 235px; position: absolute;
	left: 490px;
	top: 10px;
	background-image:url(images/web_screenshot_03.jpg);
	visibility: visible;
}

#desc3 {
	width: 215px; height: 215px; position: absolute;
	left: 490px;
	top: 10px;
	background-color:#FFF;
	visibility: hidden;
}


#box4 {
	width: 235px; height: 235px; position: absolute;
	left: 730px;
	top: 10px;
	background-image:url(images/web_screenshot_04.jpg);
	visibility: visible;
}

#desc4 {
	width: 215px; height: 215px; position: absolute;
	left: 730px;
	top: 10px;
	background-color:#FFF;
	visibility: hidden;
}


#box5 {
	width: 235px; height: 235px; position: absolute;
	left: 10px;
	bottom: 10px;
	background-image:url(images/web_screenshot_05.jpg);
	visibility: visible;
}

#desc5 {
	width: 215px; height: 215px; position: absolute;
	left: 10px;
	bottom: 10px;
	background-color:#FFF;
	visibility: hidden;
}


#box6 {
	width: 235px; height: 235px; position: absolute;
	left: 250px;
	bottom: 10px;
	background-image:url(images/web_screenshot_06.jpg);
	visibility: visible;
}

#desc6 {
	width: 215px; height: 215px; position: absolute;
	left: 250px;
	bottom: 10px;
	background-color:#FFF;
	visibility: hidden;
}


#box7 {
	width: 235px; height: 235px; position: absolute;
	left: 490px;
	bottom: 10px;
	background-image:url(images/web_screenshot_07.jpg);
	visibility: visible;
}

#desc7 {
	width: 215px; height: 215px; position: absolute;
	left: 490px;
	bottom: 10px;
	background-color:#FFF;
	visibility: hidden;
}


#box8 {
	width: 235px; height: 235px; position: absolute;
	left: 730px;
	bottom: 10px;
	background-image:url(images/web_screenshot_01.jpg);
	visibility: visible;
}

#desc8 {
	width: 215px; height: 215px; position: absolute;
	left: 730px;
	bottom: 10px;
	background-color:#FFF;
	visibility: hidden;
}

#footer{
	position: absolute;
	height: 15px;
	width: 975px;
	bottom: 20px;
	text-align: right;
}

.footer{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color:#666;
}

.footer a:link{
	text-decoration: none;
	color:#666;
}

.footer a:visited{
	text-decoration: none;
	color:#666;
}

.footer a:hover{
	text-decoration: none;
	color:#FFF;
	background-color: #666;
}