/* Start of CMSMS style sheet 'etatulkki.fi Main Stylesheet' */
html,
body,
form,
fieldset {
	margin:0;
	padding:0;
	font:100%/130% Georgia, serif;
	}

html {
	font-size: 16px;
	}
	
body {
	font-size: 62.5%;
	}

h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
ul,
ol,
dl {
	font-weight: normal;
	margin:1em 0;
	padding:0;
	}

li,
dd,
blockquote {
	margin-left:1.3em;
	}

fieldset {
	border:0;
	}

input,
select,
textarea {
	font-size:100%;
	}

a {
	text-decoration:none;
	}

a img {
	border: none;
	}

/* @group Colors */

/* Yellow 		F3D000 */
/* Light blue 	55AFC8 */
/* Dark blue 	006B8D */
/* Orange 		DC9200 */
/* Green 		96B92F */
/* Grey 		6C6B6F */
/* (Black)		212125 */

/* @end */

/* @group Elements */

body {
	background: url(uploads/system/content-bg.png) repeat-x left 16.4em;
}

#home {
	background: url(uploads/system/content-bg.png) repeat-x left 33.5em;
background-position: left 33.5em;
}

#wrapper,
#footer {
	padding-left: 8em;
	}

#header {
	background: url(uploads/system/header-bg.png) repeat-x left -5em;
	color: white;
	height: 15.6em;
	}

#home #header {
	background: url(uploads/system/header-bg.png) repeat-x;
	height: 32.7em;
	}
	
#content {
	float: left;
	padding: 2em 1em 4em 0;
	width: 48.5em;
	}

#secondary_content {
	margin-left: 53.5em;
	position: relative;
	top: -3em;
	width: 34.5em;
	}

#home #secondary_content {
	top: -18em;
	}

#footer {
	border-top: .5em solid #006B8D;
	clear: both;
	color: #666;
	font-family: Verdana, sans-serif;
	margin-left: 8em;
	padding: 1.8em 0 2em 0;
	width: 88em;
	}

/* @end */

/* @group Header */

#header h1 {
	background: url(uploads/system/logo.png) no-repeat;
	float: left;
	font-size: 1em;
	height: 6.7em;
	margin: 3em 0 0 5.5em;
	text-indent: -1234em;
	width: 25em;
	}

#header h2 {
	clear: left;
	color: white;
	font: normal normal 3em "Adobe Garamond Pro", serif;
	line-height: 1.4;
	margin: 0 0 0 2.667em;
	padding-top: 2.5em;
	width: 16.16em;
	}

#header h2.smaller {
	font: normal normal 2.5em "Adobe Garamond Pro", serif;
	width: 19em;
	}

#header h2.smallest {
	font: normal normal 2em "Adobe Garamond Pro", serif;
	width: 24em;
	}

/* @group Nav */

#header .nav {
	font-family: "Trebuchet MS", sans-serif;
	left: 42.8em;
	position: absolute;
	text-transform: uppercase;
	top: 6.5em;
	width: 59em;
	}

#header .nav li {
	float: left;
	list-style: none;
	margin-left: 2.3em;
	}

#header .nav a {
	color: white;
	display: block;
	font-size: 1.3em;
	font-weight: bold;
	padding: .3em 0;
	text-decoration: none;
	text-shadow: 0 -.3em 1.5em black;
	border-bottom: .2em solid transparent;
	}

#header .nav .current a,
#header .nav a:hover {
	border-bottom: .2em solid #F3D000;
	}

#header .nav a.sa {
	font-size: 1.1em;
/*	text-transform: none;*/
	}

/* @end */

/* @group Action Bar */

#action {
	background: #eee;
	color: #999;
	font-family: Tahoma, sans-serif;
	left: 60em;
	margin: 0 0 -10em;
	padding-top: 0;
	position: absolute;
	top: 0;
	/*width: 34.5em;*/
	z-index: 100;
	}

#action li {
	float: left;
	list-style: none;
	margin: 0;
	padding-top: 0;
	width: 11.5em;
	}

#action h4 {
	background: no-repeat 7px .95em;
	border-left: .1em solid #ccc;
	font-size: 1.1em;
	margin: .5em 0;
	padding: .9em .5em .5em;
	padding-left: 25px;
	margin: .5em 0;
	}

#action #language_selector h4 {
	border-left: none;
	}

#action li form,
#action li ul {
	font-family: Tahoma, sans-serif;
	left: -1234em;
	overflow: hidden;
	position: absolute;
	z-index: 100;
	}

#action li:hover h4 {
	background-color: #e5e5e5;
	border-bottom: .1em solid #e5e5e5;
	left: 0;
	position: relative;
/*	z-index: 100;*/
	}

#action li:focus form,
#action li:focus ul,
#action li:hover form,
#action li:hover ul {
	border-top: .1em solid #ccc;
	left: 0;
	margin: -.6em 0 0;
	padding: 1em 1em 1.5em;
	position: relative;
	width: 32.5em;
	}

#action #login:hover form {
	margin-left: -23em;
	}

/* @group Language selector */

#action #language_selector h4 {
	background-image: url(uploads/system/arrow-down.png);
	background-position: 7.7em 1.9em;
	background-repeat: no-repeat;
	}

#action #language_selector li {
	width: 50%;
	}

#action #language_selector a {
	background: no-repeat left .6em;
	}

#action #language_selector:hover a {
	color: #999;
	display: block;
	padding: .5em 0;
	padding-left: 23px;
	}

#action #language_selector a:hover {
	color: #333;
	}

#action #language_selector .en a {
	background-image: url(uploads/system/ico-gb.png);
	}

#action #language_selector .fi a,
#action #language_selector .fi2 a {
	background-image: url(uploads/system/ico-fi.png);
	}

#action #language_selector .se a {
	background-image: url(uploads/system/ico-se.png);
	}

#action #language_selector .sa a {
	background-image: url(uploads/system/ico-sa.png);
	}

#action #language_selector h4 {
	background-image: url(uploads/system/ico-language.png);
	background-position: 8px 1.05em;
	}

/* @end */

/* @group Search & Login */

#action #search h4 {
	background-image: url(uploads/system/ico-search.png);
	}

#action #login h4 {
	background-image: url(uploads/system/ico-login.png);
	}

#action li:hover form label {
	display: block;
	font-weight: bold;
	margin-top: .5em;
	}

#action li:hover form input {
	font-size: 2em;
	width: 14em;
	}

#action li:hover form .submit {
	background: none;
	border: none;
	font-size: 1em !important;
	padding: 0;
	width: 23px !important;
	/*width: 2.3em;
	width: 23px;*/
	}
/*
#action li:hover form .submit img {
	display: block;
	float: left;
	height: 2.3em;
	margin: 0;
	width: 2.3em;
	}*/

#action #search:hover form {
	margin-left: -11.5em;
	}

/* @end */

/* @group Rounded corners */

#action #language_selector {
	background: url(uploads/system/action-bg-left.png) no-repeat left bottom;
	margin-bottom: -1em;
	margin-left: -1em;
	padding-bottom: 1em;
	padding-left: 1em;
	}

#action #language_selector:hover {
	background-image: url(uploads/system/action-bgstripe-left-hover.png);
	}

#action #language_selector:hover ul {
	background: url(uploads/system/action-bg-right-hover.png) no-repeat right bottom;
	margin-bottom: -1em;
	margin-left: 11px;
	margin-right: -1em;
	padding-bottom: 2.5em;
	padding-left: 0;
	padding-right: 2em;
	width: 20.9em;
	}

#action #language_selector ul li {
	margin-left: 0;
	}

#action #search {
	background: url(uploads/system/action-bg-right.png) no-repeat right bottom;
	margin-bottom: -1em;
	margin-right: -1em;
	padding-bottom: 1em;
	padding-right: 1em;
	}

#action #search:hover {
	background-image: url(uploads/system/action-bgstripe-right-hover.png);
	}

#action #search:hover form {
	background: url(uploads/system/action-bg-left-hover.png) no-repeat left bottom;
	margin-bottom: -1em;
	margin-left: -12.5em;
	margin-right: 12px;
	padding-bottom: 2.5em;
	padding-left: 2em;
	width: auto;
	}

#action li:hover ul,
#action li:hover form {
	border-top: none;
	}

/* @end */

/* @group Hide Login for the Moment */

#header #action {
	left: 72.7em;
	width: 23em;
	}

#action #login {
	display: none;
	}

#action li:focus form,
#action li:focus ul,
#action li:hover form,
#action li:hover ul {
	width: 21em;
	}

#action #search:hover form input {
	width: 8em;
	}

/* @end */

/* @end */

/* @end */

/* @group Content */

/* @group Medialle */

#medialle .feedlink {
	background-image: url(uploads/system/feed-icon-16x16.png);
	height: 16px;
	margin: -2em 7.8em 0 0;
	width: 16px;
	}

#content .archive {
	overflow: auto;
	width: 100%;
	}

#content .archive dt {
	clear: left;
	}

#content .archive a {
	float: left;
	width: 24em;
	}

#medialle #content .archive .pdf {
	background: url(uploads/system/pdficon_small.gif) no-repeat;
	overflow: hidden;
	margin-left: 1em;
	padding: 0 0 5px 0;
	text-indent: -1234em;
	width: 22px;
	}

#medialle_photos {
	list-style: none;
	}

#medialle_photos li {
	float: left;
	position: relative;
	margin: 0 1em 1em 0;
	}

#medialle_photos img {
	background: url(uploads/system/thumb-bg.png) no-repeat;
	margin: -13px;
	padding: 13px;
	height: 58px;
	width: 58px;
	}

.biggerpicture {
	background: url(uploads/system/box-bottom-left.png) no-repeat left bottom;
	display: block;
	height: 9em;
	left: -1234em;
	padding: 0 0 20px 15px;
	position: absolute;
	top: -10.3em;
	width: 18em;
	z-index: 100;
	}

#medialle_photos li:hover .biggerpicture {
	left: 1em;
	}

#medialle_photos .biggerpicture img {
	background: url(uploads/system/box-top-left.png) no-repeat left top;
	border: none;
	float: left;
	display: block;
	height: 100px;
	margin: -15px .5em 0 -15px;
	padding: 15px 0 0 15px;
	width: 100px;
	}

#medialle_photos .biggerpicture h3 {
	background: url(uploads/system/box-top-right.png) no-repeat right top;
	font-size: 1.3em;
	margin: -15px -15px 0 0;
	padding: 15px 15px 0 0;
	}

#medialle_photos .biggerpicture p {
	font-size: .9em;
	line-height: 1.2;
	}

#medialle_photos .biggerpicture a {
	background: url(uploads/system/box-bottom-right.png) no-repeat right bottom;
	font-size: 1em;
	height: 9em;
	left: 1em;
	padding: 0 15px 20px 0;
	position: absolute;
	text-indent: -1234em;
	top: 0;
	width: 18.25em;
	}

/* @end */

/* @group Links */

a {
	color: #55AFC8;
	text-decoration: underline;
	}

/* @end */

#wrapper p,
#wrapper li,
#wrapper dd, 
#wrapper dt {
	color: #555;
	font: 1.2em/1.6 Verdana, sans-serif;
	}

#content .nosto {
	border-left: .4em solid #006B8D;
	font-style: italic;
	margin-left: .1em;
	padding-left: .5em;
	}

/* @group Yhteystiedot */

#yhteystiedot #content,
#yhteystiedot-2 #content,
#contact #content,
#oktavuohtadiedut #content,
#kontaktuppgifter #content {
	width: 84em;
	}

#yhteystiedot #content .vcard,
#yhteystiedot-2 #content .vcard,
#contact #content .vcard,
#oktavuohtadiedut #content .vcard,
#kontaktuppgifter #content .vcard {
	border-left: .4em solid #006B8D;
	float: left;
	margin: 3em 1.8em 0 .2em;
	padding-left: .6em;
	width: 25em;
	}

#contact #content .vcard,
#oktavuohtadiedut #content .vcard {
	height: 6.5em;
	}

#yhteystiedot #content h3,
#yhteystiedot-2 #content h3,
#contact #content h3,
#oktavuohtadiedut #content h3,
#kontaktuppgifter #content h3 {
	margin: -.2em 0 0;
	}

#yhteystiedot #content p,
#yhteystiedot-2 #content p,
#contact #content p,
#oktavuohtadiedut #content p,
#kontaktuppgifter #content p {
	font-size: 1.1em;
	margin: .5em 0 -.2em;
	}

.vcard .title {
	color: #999;
	}

#yhteystiedot .email,
#yhteystiedot-2 .email,
#contact .email,
#oktavuohtadiedut .email,
#kontaktuppgifter .email {
	display: block;
	}

/* @end */

/* @group Form */


#content form,
#content form fieldset {
	color: #555;
	font-family: Verdana, sans-serif;
	font-size: 11px;
	width: 55em;
	}
	
#content form h2 {
	padding: 0.4em 0 0.2em 0;
	font-weight: normal;
	}

#content form fieldset legend {
	font-size: 12px;
	font-weight: bold;
	/*margin-left: -5em;*/
	padding: 1.3em 0 1em 0;
	}	
	
#content form input,
#content form label {
	padding: 0 0.7em 0 0.1em;
	}

#content form p label {
	display: block;
	font-size: 12px;
	font-weight: bold;
	padding: 1.3em 0 1em 0;
	}

	
#content form p textarea {
	/*margin-left: 4.3em;*/
	}

#content .intro p{
        width: 30em;
        }

#content .basic,
#content .avoin  {
	padding-top: 2em;
	}

#content .avoin .kiitos{
	padding: 2em 0 2em 0;
	font-style: italic;
	}

/* @end */

.feedlink {
	background: url(uploads/system/feed-icon-16x16.png) no-repeat;
	height: 16px;
	float: right;
	margin: -3.6em 0 0 0;
	text-indent: -1234em;
	width: 16px;
	}

.post {
	border-top: .1em solid #ccc;
	overflow: auto;
	padding: 2em 0;
	}

.feedlink + .post {
	border-top: none;
	}

#content .post .date,
#medialle #content .date {
	font-size: 1em;
	margin: 1em 0 -2.5em;
	}

.post img {
	background: #666;
	border: .3em solid white;
	float: left;
	height: 14em;
	margin: 0 2em 1em 0;
	outline: .1em solid #ccc;
	width: 14em;
	/*-webkit-box-shadow: 0 .25em 1em rgba(0,0,0,.25);*/
	}

.videolink {
	background: url(uploads/system/videolink-bg.jpg) no-repeat left top;
	color: white;
	display: block;
	font: italic bold 1.8em "Trebuchet MS", sans-serif;
	height: 46px;
	letter-spacing: -.005em;
	margin: 1em 0;
	padding: 18px 2em 0 3.5em;
	text-decoration: none;
	}

.videolink:hover {
	background-position: left bottom;
	}

blockquote .quotemark {
	color: #55AFC8;
	float: left;
	font-family: "Adobe Garamond Pro", serif;
	font-size: 9em;
	line-height: 1.1;
	margin: 0 .05em -.8em -.12em ;
	}

blockquote p {
	margin: 0;
	}
 
dt {
	color: inherit;
	float: left;
	text-align: right;
	width: 7.5em;
	}

dd {
	margin-left: 7.5em;
	}

#wrapper .archive dt {
	font-size: 1em;
	padding-top: .2em;
	}

.archive a {
	font-weight: bold;
	}

/* @group Headings */

h1,
h2,
h3 {
	color: #55AFC8;
	font: bold 2.2em "Trebuchet MS", sans-serif;
	margin-bottom: 0;
	}

h1 {
	font: normal 4em "Adobe Garamond Pro", serif;
	margin-top: 1em;
	width: 11em;
	}

h3 {
	font-size: 1.3em;
	}

/* @end */

/* @end */

/* @group Secondary Content */

#videocontent {
    position: relative;
	width: 38.5em;
	}

#home #videocontent,
#hankeinfoa #videocontent  {
	margin-left: -4em;
	height: 36.5em;
}

#videocontent embed, 
#videocontent object {
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 50;
	}

#videocontent .swfir embed,
#videocontent .swfir object {
	position: static;
	}
	
#videocontent img {
	background: #ccc;
	position: absolute;
	right: 0;
	top: 0;
	width: 34.5em;
	z-index: 50;
	}

/* @end */

/* @group Footer */

#footer h4 {
	background: url(uploads/system/logo-small.png) no-repeat;
	float: left;
	height: 2.1em;
	margin: -1.1em 0 4em;
	text-indent: -1234em;
	width: 80px;
	}

#footer span,
#footer a {
	border-left: .1em solid;
	color: #666;
	margin-left: .5em;
	padding-left: .5em;
	}

#footer span span {
	border-left: none;
	margin-left: 0;
	padding-left: 0;
	}

/* @end */

/* @group Old Sifr */
/*
.sIFR-flash {
	visibility: visible !important;
	margin: 0;
	padding: 0;
}

.sIFR-replaced, .sIFR-ignore {
	visibility: visible !important;
}

.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

.sIFR-replaced div.sIFR-fixfocus {
  margin: 0pt; 
  padding: 0pt; 
  overflow: auto; 
  letter-spacing: 0px; 
  float: none;
}

.sIFR-active #content h1,
.sIFR-active #header h2 {
	font-family: Verdana;
	line-height: 1em;
	visibility: hidden;
	}
*/
/* @end */

/* @group Sifr */

@media screen {
  .sIFR-flash {
    visibility: visible !important;
    margin: 0;
    padding: 0;
  }
  
  .sIFR-replaced, .sIFR-ignore {
    visibility: visible !important;
  }
  
  .sIFR-alternate {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    display: block;
    overflow: hidden;
  }
  
  .sIFR-replaced div.sIFR-fixfocus {
    margin: 0pt; 
    padding: 0pt; 
    overflow: auto; 
    letter-spacing: 0px; 
    float: none;
  }
}
@media print {
  .sIFR-flash {
    display    : none !important;
    height     : 0;
    width      : 0;
    position   : absolute;
    overflow   : hidden;
  }
  
  .sIFR-alternate {
    visibility : visible !important;
    display    : block   !important;
    position   : static  !important;
    left       : auto    !important;
    top        : auto    !important;
    width      : auto    !important;
    height     : auto    !important;
  }
}
@media screen {
.sIFR-active #content h1,
.sIFR-active #header h2,
.sIFR-active #content .quotemark {
	font-family: Verdana;
line-height: 1.4;
	visibility: hidden;
	}
}
/* @end */

div.feed a {
	background: url(uploads/system/feed-icon-16x16.png) no-repeat;
	height: 16px;
	width: 16px;
	float: right;
	margin: -3.6em 0 0 0;
	}

div.feed img {
	visibility: hidden;
	height: 16px;
	width: 16px;
	}

div.feed + .post {
	border-top: none;
	}

#medialle div.feed a {
	background-image: url(uploads/system/feed-icon-16x16.png);
	height: 16px;
	margin: 2.5em 7.8em 0 0;
	width: 16px;
	}


/* End of 'etatulkki.fi Main Stylesheet' */

