@import (editor.css);

/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}
body {
	line-height: 1;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}
ol, ul {
	list-style: none;
}
blockquote {
	quotes: none;
}
blockquote:before, blockquote:after {
	content: '';
	content: none;
}
del {
	text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a img {
	border: none;
}

/* =Layout
-------------------------------------------------------------- */

/*
LAYOUT: Etusivu
*/

#container {
	float: left;
	width:599px;
	position: relative;
	border-right: 1px solid #666666;
}
body.alisivu #container {
	min-height: 400px;
	height: auto !important;
	height: 400px;
}
#container .content {
	margin: 0 0px 20px 0;
}
#container.etusivu{width: 100%;background: transparent url(../images/etusivu_content_bg.png) repeat-y 0 0;}
#container .nostot{width: 100%;
}
#container .nostot .grid3{width: 299px;float: left;position: relative;
min-height: 300px;}

#container .nostot .nosto3{border: 0px;width: 300px;}

#container .nostot .grid3 .content{padding: 25px 25px 0 25px;}

#container .nostot h2{color: #333333;font-weight: bold;}


#container_bottom{background-color: #666666;height: 80px;width: 100%;display: block;}

#sidebar {
	float: right;
	overflow: hidden;
	width: 299px;
	background-color:transparent;
	position:relative;
}
#footer {
	clear: both;
	width: 900px;
	background-color: #000;
	height:42px;
	margin:0;	
}

/*
LAYOUT: Sidebar blocks
*/

#sidebar h1,#sidebar h2,#sidebar h3{font-weight:bold;}
.sideblock-1, .sideblock-2, .sideblock-3{padding:20px;line-height: 20px;}
#sidebar h1.orange-shadow-right{
	background-color:#ff8400;
	line-height:35px;
	font-size:22px;
	width:288px;
	height:37px;
	padding-left:44px;
}
#sidebar h1.orange-shadow-right span{
	background: transparent url(../images/orange_shadow-d.png) no-repeat bottom right;	
	color:white;
	font-weight:normal;
	height:12px;
	float:left;
	width:290px;}

#sidebar ul{list-style:square outside; list-style-image:url(../images/bullet_white.png);display:block;}	
#sidebar ul li{margin-left:70px; width:200px;font-size:18px;font-family:Georgia, serif;line-height:20px;padding-top:12px;clear:both;}
#sidebar a, #sidebar a:visited,
#content a.etusivun-uutislinkki, #content a.etusivun-uutislinkki:visited{color:#000;text-decoration:none;}
#content a.etusivun-uutislinkki-span, #content a.etusivun-uutislinkki-span:visited{color:#ff8400;text-decoration:none;}
#sidebar a:hover,
#content a.etusivun-uutislinkki:hover,
#content a.etusivun-uutislinkki-span:hover{text-decoration:underline;}

#sidebar .sideblock-3 ul li{width:160px;}	
/* =Fonts
-------------------------------------------------------------- */
body,
input,
textarea{
	font-family: Arial, sans-serif;
	font-size: 62.5%;
}
#navigation .menu,
#navigation div.menu ul
input[type=submit] {
	font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
}
pre {
	font-family: "Courier 10 Pitch", Courier, monospace;
}
code {
	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

h1,h2,h3,h4,h5,h6{font-family: Arial, Helvetica, sans-serif;margin-bottom: .8em;}

p{font-size:1.4em;}

h1,h2{font-size: 2em;}
h3{font-size: 1.8em;}
h4{font-size: 1.6em;}
h5{font-size: 1.4em;}

#container h1{color:#d71921; text-transform:uppercase;font-weight:600;}
#slider_wrap h1{color:white;}

#container span.24px{font-size:24px;}

#content h3 span.kysymykset{background: transparent url(../images/bullet_yellow.png) no-repeat 0px 7px;margin-left:-20px;
padding-left:20px;}

#container h1.page_title{display: block; width: 574px; background:  transparent url(../images/page_title_bg.png) repeat-x 0 0; height: 39px;color: white;padding: 20px 0 0 25px;text-transform: none;font-weight:normal;}

.size16px{font-size:16px;}
.size18px{font-size:18px;}
.size20px{font-size:20px;}
.size24px{font-size:24px;}
.size28px{font-size:28px;}
.size32px{font-size:32px;}
.size36px{font-size:36px;}
.size42px{font-size:42px;}
.size45px{font-size:45px;}

.harmaa{color:#cccccc !important;}
.valkoinen{color:white !important;}

/* =Rakenne
-------------------------------------------------------------- */

#navigation .menu-header,
#main,
#wrapper {
	margin: 0 auto;
}
#wrapper {
	position:relative;
	box-shadow: 0 0px 10px -2px #888;
	-moz-box-shadow: 0 0px 10px -2px #888;
	-webkit-box-shadow: 0 0px 10px -2px #888;
	width: 900px;
	overflow: hidden;
	margin-bottom: 30px;
}

/* =Global Elements
-------------------------------------------------------------- */

body {
	background: transparent url(../images/juhlapesu_pattern.png) repeat 0 0;
}
body,
input,
textarea {
	color: #333333;
}
hr {
	background-color: #e7e7e7;
	border: 0;
	clear: both;
	height: 1px;
	margin-bottom: 8px;
}

.clear{
	clear: both;
	margin:0;
	padding:0;
}

/* Text elements */
p {
	margin-bottom: 18px;
}
ul {
	list-style: square;
	margin: 0 0 18px 1.5em;
}
ol {
	list-style: decimal;
	margin: 0 0 18px 2.5em;
}
ol ol {
	list-style: upper-alpha;
}
ol ol ol {
	list-style: lower-roman;
}
ol ol ol ol {
	list-style: lower-alpha;
}
ul ul,
ol ol,
ul ol,
ol ul {
	margin-bottom: 0;
}
dl {
	margin: 0 0 24px 0;
}
dt {
	font-weight: bold;
}
dd {
	margin-bottom: 18px;
}
strong {
	font-weight: bold;
}
cite,
em,
i {
	font-style: italic;
}
big {
	font-size: 131.25%;
}
ins {
	background: #ffc;
	text-decoration: none;
}
blockquote {
	font-style: italic;
	padding: 0 1em;
	text-align:right;
	color:#ff8400;
	font-size:16px;
}
blockquote cite,
blockquote em,
blockquote i {
	font-style: normal;
}
pre {
	background: #f7f7f7;
	color: #222;
	line-height: 18px;
	margin-bottom: 18px;
	padding: 1.5em;
}
abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}
sup,
sub {
	height: 0;
	line-height: 1;
	position: relative;
	vertical-align: baseline;
}
sup {
	bottom: 1ex;
}
sub {
	top: .5ex;
}


input[type="text"],
textarea,
.formEmailinput {
	background: #f9f9f9;
	border: 1px solid #ccc;
	box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);
	-moz-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);
	-webkit-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);
	padding: 2px;
	width: 100%;
}
a:link,a:visited {
	color: #666666;
}

a:active,
a:hover {
	color: #d60005;
}

/* Text meant only for screen readers */
.screen-reader-text {
	position: absolute;
	left: -9000px;
}


/* =Header
-------------------------------------------------------------- */

#header {
	width: 100%;
	position:relative;
	height: 98px;
	background-color: #fff;
	border-bottom: 1px solid #666666;
}
#logo {
	width: 172px;
	clear:both;
	background: transparent url(../images/juhlapesu-logo.png) no-repeat top center;
	height:48px;
	position: absolute;
	left:40px;
	top:30px;
	text-indent: -9999px;
}
#site-title a {
	color: #000;
	font-weight: bold;
	text-decoration: none;
}

/* =Slider
-------------------------------------------------------------- */

#main #slider_wrap{height: 299px;border-bottom: 1px solid #666666;}

#main #slider_wrap .slider_sidebar{width: 300px; height:299px; background: transparent url(../images/slider_sidebar_bg.png) no-repeat 0 0;display: block;float: left;position:relative;}
#main #slider_wrap .slider_content{width: 600px; height: 100%; float: left;}

#main #slider_wrap .slider_sidebar .content {overflow: hidden;padding:18px 0 0 0;margin:0;color:white; text-align:center;z-index:10;position:relative;}

#main #slider_wrap .slider_sidebar .content h1{font-size:60px;margin-bottom:22px;}
#main #slider_wrap .slider_sidebar .content h2{font-size:20px;margin-bottom:32px;}
#main #slider_wrap .slider_sidebar .content p{margin-bottom:15px;}

#main #slider_wrap .slider_sidebar .content a, 
#main #slider_wrap .slider_sidebar .content a:visited{color:white;text-decoration:none;}
#main #slider_wrap .slider_sidebar .content a:active,
#main #slider_wrap .slider_sidebar .content a:hover{color:white; text-decoration:underline;}

#main #slider_wrap .slider_sidebar .content a:before
{
 background: url("../images/link_arrow_white.png");
 content: "";
 display: inline-block;
 height: 8px;
 margin-right: 5px;
 width: 11px;
}
#main #slider_wrap .slider_sidebar .content a:before ie7_pseudo0
{
 background: url("../images/link_arrow_white.png");
 content: "";
 display: inline-block;
 height: 8px;
 margin-right: 5px;
 width: 11px;
}
#main #slider_wrap .slider_content .slideshow_images{position: relative; overflow: hidden; width: 600px; height: 299px;}
#main #slider_wrap .slider_content .slideshow_images ul{list-style: none;margin: 0; padding: 0;}
#main #slider_wrap .slider_content .slideshow_images ul li{float: left;}
#main #slider_wrap .slider_content .slideshow_images input{text-indent: -9999px;position: absolute;bottom:20px;z-index: 100;border:0;height: 20px; width: 30px; display: block;cursor: pointer;font-size: 0; line-height: 0;}
#main #slider_wrap .slider_content .slideshow_images input.carousel-next{ right: 15px; bottom:10px;background: transparent url(../images/slider_arrow_prev.png) no-repeat 0 0;}
#main #slider_wrap .slider_content .slideshow_images input.carousel-next:hover{background-position: -30px 0px;}
#main #slider_wrap .slider_content .slideshow_images input.carousel-previous{right: 15px;bottom:30px; background: transparent url(../images/slider_arrow_next.png) no-repeat 0 0;}
#main #slider_wrap .slider_content .slideshow_images input.carousel-previous:hover{background-position: -30px 0px;}
/* =Menu
-------------------------------------------------------------- */

#navigation {
	background-color:transparent;
	display: block;
	float: right;
	margin: 0 auto;
	color:white;
	position:relative;
	left: 60px;
	top: 42px;
	width: 700px;
}
#navigation .menu-header {
	font-size: 15px;
	margin-left: 12px;
}
#navigation .menu-header ul,
div.menu ul {
	list-style: none;
	margin: 0;
}
#navigation .menu-header li,
div.menu li {
	float: left;
	position: relative;
}
#navigation a {
	color: #919191;
	display: block;
	line-height: 32px;
	padding: 0 5px;
	text-decoration: none;
	font-family:Helvetica,Arial, sans-serif;
	font-weight:bold;
	text-transform: uppercase;
	font-stretch: condensed;
}
#navigation ul ul {
	display: none;
	position: absolute;
	top: 38px;
	left: 0;
	float: left;
	width: 180px;
	z-index: 99999;
}
#navigation ul ul li {
	min-width: 180px;
}
#navigation ul ul ul {
	left: 100%;
	top: 0;
}
#navigation ul ul a {
	line-height: 1em;
	padding: 10px;
	width: 160px;
	height: auto;
}
#navigation li:hover > a,
#navigation ul ul :hover > a {
	background: transparent;
	color: #000;
}
#navigation ul li:hover > ul {
	display: block;
}
#navigation ul li.current> a{
	color: #000;
}
* html #navigation ul li.current_page_item a,
* html #navigation ul li.current-menu-ancestor a,
* html #navigation ul li.current-menu-item a,
* html #navigation ul li.current-menu-parent a,
* html #navigation ul li a:hover {
	color: #fff;
}


/* =Content
-------------------------------------------------------------- */

#main {
	overflow: hidden;
	position:relative;
	background: #c8c0b8 url(../images/main-bg.png) repeat-y top right;
	background-color:white;
}
#container .content {
	line-height: 20px;
	padding:5px 20px 20px 20px;
}

#main a:before
{
 background: url("../images/link_arrow.png");
 content: "";
 display: inline-block;
 height: 8px;
 margin-right: 5px;
 width: 11px;
}
#main a{ text-decoration: none;}

#content input,
#content textarea{color: #000;
	font-size: 14px;
	line-height: 20px;}
#content p,
#content ul,
#content ol,
#content dd,
#content pre,
#content hr {
	margin-bottom: 15px;
}

#content p.kirjoittaja{font-weight: bold; text-align: right; padding:.6em 1em;}
#content ul ul,
#content ol ol,
#content ul ol,
#content ol ul {
	margin-bottom: 0;
}
#content pre,
#content kbd,
#content tt,
#content var {
	font-size: 15px;
	line-height: 21px;
}
#content code {
	font-size: 13px;
}
#content dt,
#content th {
	color: #000;
}
#content h1,
#content h2,
#content h3,
#content h4,
#content h5,
#content h6 {
	color: #000;
	line-height: 1.5em;
	margin: 0 0 0px 0;
}
#content h1{color: #ff8400;font-size:2.2em;margin-bottom:.4em;}
#content h2{color: #ff8400;font-size:1.8em;margin-bottom:1em;}
#content h3{color: #000000;font-size:1.6em;margin-bottom:.7em;}
#content h4{color: #000000;font-size:1.4em;margin-bottom:.5em;}

#content table {
	border: 1px solid #e7e7e7;
	margin: 0 -1px 24px 0;
	text-align: left;
	width: 100%;
}
#content table.formHolder {
	border: 0px solid;
	margin: 0 -1px 24px 0;
	text-align: left;
	width: 70%;
}
#content tr th,
#content thead th {
	color: #888;
	font-size: 12px;
	font-weight: bold;
	line-height: 18px;
	padding: 9px 24px;
}
#content tr td {
	border-bottom: 1px solid #e7e7e7;
	padding: 6px 10px;
}
#content tfoot tr td {
	border-bottom: 0px solid #e7e7e7;
	padding: 6px 10px;
}
#content tr.odd td {
	background: #f2f7fc;
}

#content .viikon_koukku{width:65%; float:left;margin-top:1.5em;}
#content .viikon_koukku_kuva {float:right; height:220px; width: 35%; background: transparent url(../images/kuuluttaja.jpg) no-repeat left center}

#content .formSubmit,#content .formSubmit:hover {	
-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-o-border-radius:5px;
	border-radius:5px;
background-color:#FF8400;
border:1px solid #C8C0B8;
padding:4px 10px;
cursor:pointer;cursor:hand
}
#content .formSubmit:hover{
background-color:#6f6b65;color:white;}

#content .lisakentta{margin-top:30px;}

/* =Palautelomake
-------------------------------------------------------------- */
table.formHolder{width: 90%;}
table.formHolder textarea {height: 100px;font-size: 1.4em;}

table.formHolder input[type="text"],
table.formHolder input[type="email"]{height: 14px; width: 40%; font-size: 1.4em;}

table.formHolder .formSubmit {
	border: 0; 
	height: 9px;
	background-color: white;
	margin-top: 10px;
	cursor: pointer;
	background: transparent url(../images/laheta_btn.png) no-repeat 0 0;
	text-indent: -9999px;
	width: 48px;
	/* IE7 FIX*/
	font-size: 0;
	display:block;
	line-height: 0;
}
table.formHolder .formSubmit:hover{background-position: 0 -9px;}

p.formRequiredNotice{color:#ff0000;}

ul.formRequiredList{display:none;}

tr.formFieldHasError td.formFieldHolder input.formTextinput,
tr.formFieldHasError td.formFieldHolder input.formEmailinput,
tr.formFieldHasError td.formFieldHolder textarea{background-color:#d71921; color:#ffffff;}

tr.formFieldHasError td.formLabelHolder label{color:#ff0000;}


/* =Widget Areas
-------------------------------------------------------------- */

.widget-area ul {
	list-style: none;
	margin-left: 0;
}

#sidebar span.facebook{background: transparent url(../images/facebook-logo.png) no-repeat center right; display:block;
height:35px;
margin-left:155px;
margin-top:-36px;
width:35px;}

#sidebar span.youtube{background: transparent url(../images/youtube-logo.png) no-repeat center right; display:block;
height:25px;
margin-left:130px;
margin-top:-30px;
width:60px;}

/* =Footer
-------------------------------------------------------------- */

#footer {
	margin:0;
	
}
#footer p{font-family:Arial, sans-serif; font-size:14px; color:#ccc;padding-top:16px;text-align:center;}