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

body, div, h1, h2, h3, h4, h5, h6, p, img, img a, a img, form, fieldset, input, blockquote {
	margin: 0; padding: 0; border: 0;
}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	padding: 10px;
}

html {

	background-image: url(images/bg.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: fixed;
	background-color: #005188;
}

h1, h2, h3, h4, h5, h6, p {
	padding: 0 10px 0 0;
}

p {
	line-height: 1.3;
}

.circle {
	background-image: url(images/circle.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	width: 673px;
	height: 674px;
	margin: 0 auto;
}

.circleSegment {
	position: absolute;
	background-position: 0;
	background-repeat: no-repeat;
	z-index: 2;
}

.circleSegment.nw {
	background-image: url(images/circle_hover_nw.png);
	width: 313px;
	height: 270px;
	margin: 2px 0 0 24px;
}

.circleSegment.ne {
	background-image: url(images/circle_hover_ne.png);
	width: 312px;
	height: 284px;
	margin-left: 338px;
	margin-top: -4px;
	background-position: 1px;
}

.circleSegment.sw {
	background-image: url(images/circle_hover_sw.png);
	width: 286px;
	height: 390px;
	margin-top: 216px;
	margin-left: 1px;

}

.circleSegment.s {
	background-image: url(images/circle_hover_s.png);
	width: 405px;
	height: 222px;
	margin: 454px 0 0 134px;
}


.circleSegment.se {
	background-image: url(images/circle_hover_se.png);
	width: 196px;
	height: 204px;
	margin: 219px 0 0 477px;
}


.circleSegment.sse {
	background-image: url(images/circle_hover_sse.png);
	width: 232px;
	height: 230px;
	margin: 377px 0 0 429px;
}

.circleHotspot {
	position: absolute;
	z-index: 3;
}

.circleHotspot a {
	display: block;
	width: 100%;
	height: 100%;
}

.circleHotspot.nw {
	width: 336px;
	height: 216px;
}

.circleHotspot.ne {
	width: 313px;
	height: 218px;
	margin-left: 338px;
}

.circleHotspot.sw {
	width: 239px;
	height: 183px;
	margin-top: 274px;
}

.circleHotspot.s {
	width: 188px;
	height: 222px;
	margin: 454px 0 0 241px;
}

.circleHotspot.se {
	width: 182px;
	height: 148px;
	margin: 250px 0 0 491px;
}

.circleHotspot.sse {
	width: 182px;
	height: 154px;
	margin: 408px 0 0 476px;
}

.circleLightWrapper {
	width: 305px;
	height: 305px;
	padding: 185px 0 0 184px;
}

.circleLight {
	width: 305px;
	height: 305px;
	background-image: url(images/circle_light.png);
	background-repeat: no-repeat;
	background-position: 17px 17px;
	animation        : circleLightRotation 7s linear infinite;
	-moz-animation   : circleLightRotation 7s linear infinite; /* Firefox */
	-webkit-animation: circleLightRotation 7s linear infinite; /* Safari and Chrome */
	-o-animation     : circleLightRotation 7s linear infinite; /* Opera */
}

@keyframes circleLightRotation
{
	from {transform:rotate(0deg);}
	to {transform  :rotate(360deg);}
}

@-moz-keyframes circleLightRotation /* Firefox */
{
	from {-moz-transform:rotate(0deg);}
	to {-moz-transform  :rotate(360deg);}
}

@-webkit-keyframes circleLightRotation /* Safari and Chrome */
{
	from {-webkit-transform:rotate(0deg);}
	to {-webkit-transform  :rotate(360deg);}
}

@-o-keyframes circleLightRotation /* Opera */
{
	from {-o-transform:rotate(0deg);}
	to {-o-transform  :rotate(360deg);}
}