@charset "UTF-8";

/* IE */
@font-face {
	font-family: Gabrielle;
	src: url(Gabrielle.eot);
}

/* Muut */
@font-face {
	font-family: Gabrielle;
	src: local(Gabrielle), url(Gabrielle.ttf) format('truetype');
}

body, #content, #menu, #top-left, #bottom-left, #top-right, #bottom-right, p, a, h1, ul, li {
	margin: 0;
	padding: 0;
}

body {
	background: #CCCCCC;
}

body, a:visited {
	font-family: /*Arial,*/ Gabrielle, Verdana, Helvetica, sans-serif;
	font-size: 20px; /* Gabrielle */
	/*font-size: 15px; /* Arial */
	/*font-style: italic; /* Arial */
	/*color: #990033;*/
	color: #FF00FF;
}

h1 {
	font-size: large;	
}

img.sirpa {
	margin-left: 40px;
	border: solid black 10px;
}

a {
	text-decoration: none;
	border-bottom: dotted #FF00FF 1px;
	color: #FF00FF;
}

a:hover, a:active {
	background: #FF00FF;
	color: white;
}

p, li {
	margin-top: 0.3em;
	margin-bottom: 0.3em;
	line-height: 1.5em;
}

#menu p {
	margin-top: 0.8em;
	margin-bottom: 0.8em;
}

#menu {
	position: absolute;
	top: 50px;
	left: 590px;
	width: 150px;
}

#content {
	background: url(tausta.jpg) no-repeat;
	width: 960px;
	height: 643px;
	position: relative;
	margin: 0 auto;
	border: solid black 46px;
}

#index {
	margin-top: 40px;
}

#top-left {
	position: absolute;
	top: 180px;
	left: 16px;
	width: 205px;
}

#bottom-left {
	position: absolute;
	top: 170px;
	left: 16px;
	width: 260px;
}

#top-right {
	position: absolute;
	top: 260px;
	left: 240px;
	width: 290px;
}

#bottom-right {
	position: absolute;
	top: 285px;
	left: 290px;
	width: 290px;
}

#bottom-center {
	position: absolute;
	top: 350px;
	left: 135px;
	width: 400px;
}

#contact {
	position: absolute;
	top: 290px;
	left: 250px;
	width: 290px;
}