body{
	font-family:arial,verdana,helvetica,sans-serif;
	background-color:#ffffff;
	background-image: url('/DowebEasyCMS/Sivusto/Kuvat/rakenne/MS_2011_tausta.gif');
	background-repeat: no-repeat;
	background-position: top center;
	margin-top: 5px;
}

body.palvelumme{
	font-family:arial,verdana,helvetica,sans-serif;
	background-color:#ffffff;
	background-image: url('/DowebEasyCMS/Sivusto/Kuvat/rakenne/tausta_palvelumme.jpg');
	background-repeat: no-repeat;
	background-position: top center;
	margin-top: 0px;
}

.palvelummesivu{
	background-image: url('/DowebEasyCMS/Sivusto/Kuvat/rakenne/tausta_palvelummesivu.gif');
	background-repeat: repeat-y;
	background-position: top left;
}

.palvelummeyla{
	font-family:arial,verdana,helvetica,sans-serif;
	background-image: url('/DowebEasyCMS/Sivusto/Kuvat/rakenne/MS_palvelumme_banneri.png');
	background-repeat: no-repeat;
	background-position: top left;
	padding-top: 225px;
}

div, td, text, textarea {
	font-family:arial,verdana,helvetica,sans-serif;
	font-size:9pt;
	color:#000000;
}

H1
{
	font-family:arial,verdana,helvetica,sans-serif;
	font-size:14.5px;
	color:#111111;
}

H2
{
	font-size: 12.5px;
	color: #333333;
	font-family: arial,verdana,helvetica,sans-serif;
}

.pikkuleipis
{
	font-family:arial,verdana,helvetica,sans-serif;
	font-size:8pt;
	color:#111111;
}

a,a:link,a:active,a:visited {
	color: #111111;
	font-size: 9pt;
	text-decoration: none; 
}


a:hover {
	color: #CCCCCC;
	font-size: 9pt;
	text-decoration: none; 
}


hr
{
color:#cccccc;
}


.logo{
	background-image: url('/DowebEasyCMS/Sivusto/Kuvat/rakenne/logo_mainossatama.png');
	background-repeat: no-repeat;
	background-position: bottom center;
}

.info{
	background-image: url('/DowebEasyCMS/Sivusto/Kuvat/rakenne/tausta_info.png');
	background-repeat: no-repeat;
	background-position: bottom center;
}

td.viivat{
	border-right:1px dotted #333333; 
}

.uutinenPvm
{
	font-size: 8pt;
	color: #CCCCCC;
	font-family: arial,verdana,helvetica,sans-serif;
}

a.uutinenLnk,a.uutinenLnk:visited,a.uutinenLnk:active,a.uutinenLnk:link
{
	font-family: verdana, arial, helvetica,sans-serif;
	font-size:8pt;
	color:#111111;
	text-decoration: none; 
	padding-bottom: 4px;
}


a.uutinenLnk:hover {
	font-family: verdana, arial, helvetica,sans-serif;
	font-size:8pt;
	color: #111111;
	text-decoration: underline; 
}

.oikea {
	padding-top: 0px;	
	padding-left: 35px;
}



#footer-wrap {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
}

#footer-container {
	height: 30px;
	background: url('/DowebEasyCMS/Sivusto/Kuvat/rakenne/tausta_footer.gif') no-repeat center bottom;
}

#footer {
	width: 800px;
	margin: 0 auto;
	position: relative;
}


/* set the size of the definition list <dl> and add the background image */
#imap {
  display:block; 
  width:680px; 
  height:331px; 
  background:url('/DowebEasyCMS/Sivusto/Kuvat/rakenne/satamalaiset.png') no-repeat; 
  position:relative;
  }

/* set up the definition list <dt><a> to hold the background image for the hover state */
#imap a#title {
  display:block; 
  width:680px; 
  height:0; 
  padding-top:331px; 
  overflow:hidden; 
  position:absolute; 
  left:0; 
  top:0; 
  }
/* the hack for IE pre IE6 */
* html #imap a#title {
  height:331px;
  he\ight:0;
  }

/* the <dt><a> hover style to move the background image to position 0 0 */
#imap a#title:hover {
  background-position: 0 0; 
  z-index:10;
  }

/* place the <dd>s in the correct absolute position */
#imap dd {
  position:absolute; 
  padding:0; 
  margin:0;
  }
#imap #pic1 {
  left:14px; 
  top:95px; 
  z-index:20;
  }
#imap #pic2 {
  left:104px; 
  top:50px; 
  z-index:20;
  }
#imap #pic3 {
  left:194px; 
  top:25px; 
  z-index:20;
  }
#imap #pic4 {
  left:284px; 
  top:55px; 
  z-index:20;
  }
#imap #pic5 {
  left:379px; 
  top:7px; 
  z-index:20;
  }
#imap #pic6 {
  left:529px; 
  top:75px; 
  z-index:20;
  }

/* style the <dd><a> links physical size and the background image for the hover */
#imap a#kari, #imap a#teemu, #imap a#pirjo, #imap a#johanna, #imap a#mika, #imap a#kalle {
  display:block; 
  width:80px; 
  height:140px; 
/*  background:transparent url(../images/hover.gif) -100px -100px no-repeat; */
  text-decoration:none; 
  z-index:20;
  }

/* style the span text so that it is not initially displayed */
#imap a span, #imap a:visited span {
  display:none;
  }

/* move the link background image to position 0 0 when hovered */
#imap a#kari:hover, #imap a#teemu:hover, #imap a#pirjo:hover, #imap a#johanna:hover, #imap a#mika:hover, #imap a#kalle:hover {
  background-position:0 0;
  }

/* define the common styling for the span text */
#imap a:hover span {
  position:absolute;  
  width:632px; 
  height: 221px;
  display:block; 
  font-family:arial; 
  font-size:12px; 
  background:#fff; 
  color:#000; 
  border:0px solid #000; 
  padding:30px;
  background: url('/DowebEasyCMS/Sivusto/Kuvat/rakenne/tausta_info.png') no-repeat 5px 5px; 
  }
/* the hack for IE pre IE6 */
* html #imap a:hover span {
  width:632px; w\idth:631px;
  }

/* move the span text to a common position at the bottom of the image map */
#imap a#kari:hover span {
  left:0px; 
  top:225px;
  cursor:default;
  }
#imap a#teemu:hover span {
  left:-90px; top:270px;
  }
#imap a#pirjo:hover span {
  left:-180px; 
  top: 295px;
  }
#imap a#johanna:hover span {
  left:-270px; 
  top:265px;
  }
#imap a#mika:hover span {
  left:-365px; 
  top:313px;
  }
#imap a#kalle:hover span {
  left:-515px; 
  top:245px;
  }


#imap a span:first-line {
  font-weight:bold; 
  font-style:italic;
  }



a.copyDoweb,a.copyDoweb:link,a.copyDoweb:active,a.copyDoweb:visited,a.copyDoweb:hover {
	color: #cccccc;
	text-decoration: none;
	font-family: arial,verdana,helvetica,sans-serif;
	font-size:8pt;
	font-weight: bold;
}

