@import url(http://fonts.googleapis.com/css?family=Rambla:400,700);

@font-face {
font-family:'po';
src:url('../fnt/po.eot');
src:url('../fnt/po.eot?#iefix') format('embedded-opentype'),
url('../fnt/po.woff2') format('woff2'),
url('../fnt/po.woff') format('woff'),
url('../fnt/po.ttf') format('truetype');
font-weight:normal;
font-style:normal;
}

body {
margin:0;
padding:0;
font-size:15px;
font-weight:400;
background-image:url('../images/bg.png');
background-repeat:repeat-x;
background-color:#cf1e76;
background-attachment:fixed;
font-size:100%;
}

#pohja {
background-color:#fff;
width:100%;
min-width:1016px;
padding-top:36px;
}

#cnt {
font-family:'Rambla', sans-serif;
max-width:1016px;
min-width:1016px;
width:100%;
background-color:transparent;
margin:0 auto;
padding-top:10px;
}

#oline {
background-color:transparent;
width:100%;
height:81px;
font-weight:700;
font-size:18px;
color:#fff;
line-height:78px;
}

#logo { float:left;
width:328px;
height:78px; 
margin-left:10px; }

#logo img { 
max-width:328px;
min-width:10%;
height:auto;
}

#pallo {
float:right;
width:76px;
height:76px; 
margin-right:10px;
margin-top:0px;
}

#nav {
max-width:1016px;
min-width:1016px;
width:100%;
background:rgba(255,255,255,0.3);
height:50px;
z-index:100;
}

#nav ul {
display:inline;
text-align:left;
list-style-type:none;
margin:0;
padding:0;
}

#nav ul li {
display:inline-block;
font-family:'po',sans-serif;
font-size:20px;
line-height:0;
text-transform:uppercase;
position:relative;
cursor:pointer;
border:none;
margin:0;
margin-right:-5px;
padding:27px 0px 25px 0px;
}

#nav ul li:hover {
color:#000;
background:rgba(255,255,255,0.4);
}

#nav ul li ul {
display:none;
position:absolute;
top:50px;
left:-1px;
width:150px;
visibility:hidden;
opacity:0;
padding:0;
}

#nav ul li ul li {
display:block;
font-size:20px;
color:#000;
background-color:#fff;
padding:16px 0px 16px 6px;
margin:0;
}

#nav ul li ul li:hover {
color:#f19042;
background-color:#fff;
}

#nav ul li:hover ul {
display:block;
opacity:1;
visibility:visible;
border:1px solid #BF5A8C;
border-top:none;
margin-top:0px;
-webkit-box-shadow:0 6px 6px -6px #8E0F4F;
-moz-box-shadow:0 6px 6px -6px #8E0F4F;
box-shadow:0 6px 6px -6px #8E0F4F;
}

#nav ul li a { padding:15px 12px 11px 12px; }

#nav a, #nav a:link, #nav a:active, #nav a:visited { color:#fff; text-decoration:none; padding-top:14px; }
#nav a:hover, #nav ul li.act a { color:#000; background-color:#fff; padding-top:14px; }
#nav ul li ul li a { color:#000 !important; margin:0; padding:5px 0px 0px 5px; }
#nav ul li ul li a:hover { background-color:transparent !important; color:#911051 !important; }

#nav > a { display:none; }

#sossut { width:130px; height:32px; float:right; margin-top:9px; margin-right:6px; padding:0; overflow:hidden; }
#sossut ol.slist { list-style-type:none; display:inline; padding-left:0; }
#sossut ol.slist li { float:left; margin:0; padding:0; margin-right:10px; }
#sossut ol.slist li a { background-image:url('../images/sossut.png'); background-repeat:no-repeat; width:32px; height:32px; display:block; }
#sossut ol li a:hover { background-color:transparent !important; }
#sossut .fb a { background-position:0 0; }
#sossut .fb a:hover { background-position:-32px 0; background-color:none !important;}
#sossut .in a { background-position:0 -32px; }
#sossut .in a:hover { background-position:-32px -32px; }
#sossut .sp a { background-position:0 -64px; }
#sossut .sp a:hover { background-position:-32px -64px; }

#cwide, #cwide2 {
width:1016px;
margin:0 auto;
background-color:#fff;
padding-top:26px;
padding-bottom:32px;
margin-bottom:32px;
-webkit-box-shadow:0 12px 6px -6px #8E0F4F;
-moz-box-shadow:0 12px 6px -6px #8E0F4F;
box-shadow:0 12px 6px -6px #8E0F4F;
background-image:url('../images/ukko.png'); 
background-repeat:no-repeat; 
background-position:bottom right;
font-family:'Rambla', sans-serif;
font-size:16px;
line-height:1.45;
}

#cwide2 { width:976px; padding:26px 20px 20px 20px; }

#cmid {
float:left;
width:34%;
width:472px;
width:696px;
margin-top:0;
margin-left:33%;
margin-left:20px;
background-color:#fff;
}

#cleft {
float:left;
width:33%;
width:224px;
margin-top:0;
margin-left:-67%;
margin-left:-720px;
background-color:#fdd;
}

#cright {
float:right;
width:33%;
width:256px;
margin-top:0;
margin-right:22px;
background-color:#fff;
}

h1 {
font-family:'po',sans-serif;
font-size:36px;
font-weight:400;
letter-spacing:0.2em;
text-transform:uppercase;
margin-top:0;
color:#8E0F4F;
}

h2, h2.ankku {
font-family:'po',sans-serif;
font-size:24px;
font-weight:700;
letter-spacing:0.1em;
margin:22px 0px 6px 0px;
color:#8E0F4F;
}

h2.ankku:before {
display:block;
content:" ";
margin-top:-58px;
height:58px;
visibility:hidden;
}

h3 {
font-family:'Rambla', sans-serif;
font-size:20px;
font-weight:bold;
color:#C64871;
padding-top:15px;
margin-bottom:0px;
}

p {
font-family:'Rambla', sans-serif;
font-size:16px;
line-height:1.45;
}

p.date, p.small { font-size:12px; margin-top:0; }

#cwide a,
#cwide a:link,
#cwide a:active,
#cwide a:visited { color:#8E0F4F; text-decoration:none; outline:0; }
#cwide a:hover { color:#7E0F3F; text-decoration:underline; }

#cwide2 a,
#cwide2 a:link,
#cwide2 a:active,
#cwide2 a:visited { color:#8E0F4F; text-decoration:none; outline:0; }
#cwide2 a:hover { color:#7E0F3F; text-decoration:underline; }

#cright ul { 
font-family:'Rambla', sans-serif;
padding-left:2px;
margin-top:12px;
margin-bottom:0;
}

#cright ul li {
font-weight:700;
list-style:none;
color:#405462 !important;
font-size:14px;
margin-bottom:10px;
}

#cright ul li ul {
margin-top:0;
margin-bottom:0;
margin-left:10px;
}

#cright ul li ul li {
margin-top:0;
margin-bottom:0;
}

br.clear { clear:both; margin:0; padding:0; font-size:1px; height:1px; }

div.vidco {
position:relative;
padding-bottom:50.25%;
padding-top:30px;
height:0;
overflow:hidden;
}

div.vidco iframe, div.vidco object, div.vidco embed {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}

#cright div.crightyhtye { font-size:14px !important; }
#cright div.crightyhtye p { font-size:14px !important; }
#cright div.crightyhtye ol, #cright div.crightyhtye ul { margin-left:0; padding-left:12px; }
#cright div.crightyhtye ul li { font-size:14px !important; }
#cright div.crightyhtye ol li { font-size:14px !important; }

#instafeed img { border:1px solid #fff; margin:0; padding:0; width:74px; height:74px; margin:0px 6px 0px 0px; }
#instafeed a:hover img { border:1px solid #aaa; }

img.lz { outline:0; margin:0px 4px 4px 0px; }
a.imglnk img { border:2px solid #fff; }
a.imglnk img:hover { border:2px solid #BD5A8B; }

div.alignright { text-align:right; }

div.kuva {
text-align:center;
border:0px solid #000;
padding:5px 0px 10px 0px;
font-size:90%;
font-style:italic;
width:100%; height:auto;
}

div.kuva img {
margin:10px 5px 5px 0px;
padding:2px;
border:1px solid #000;
width:100%; height:auto;
}

div.img-container img {
border:1px solid #000;
padding:2px;
background-color:#fff;
width:100%;
max-width:600px;
min-width:200px;
}

div.img-container {
font-style:italic;
font-size:80%;
margin-bottom:20px;
}

.picleft {
float:left;
border:1px solid black;
padding:2px;
margin:0px 10px 10px 0px;
}

.picright {
float:right;
border:1px solid black;
padding:2px;
margin:5px 0px 10px 20px;
}

.center {
text-align:center;
}

.right {
text-align:right;
}

br.clear { clear:both; margin:0; padding:0; font-size:1px; height:1px; }

#footer { width:100%; min-width:1016px; height:130px; margin-bottom:60px; color:#fff; text-align:center; background-color:#74d1da; }

form, table { margin-top:0; }
hr { color:#4F667D; background-color:#4F667D; height:1px; text-align:center; }
td.formi { vertical-align:top; text-align:right; padding:3px; }
textarea.formi { color:#000; background-color:#fff; border:1px solid #000; width:95%; height:150px; padding-left:3px; }
input.formi { color:#000000; background-color:#fff; border:1px solid #000; width:95%; height:22px; padding-left:3px; }
div.sivutus { width:92%; font-size:100%; color:#000; padding:5px 10px 3px 40px; margin:10px 0px 0px 20px; text-align:right; }
div.boksi { border:none; background-image:url('../images/_quot1.png'); background-repeat:no-repeat; background-position:5px 5px; width:92%; font-size:90%; color:#000; margin-left:0px; padding:5px 22px 5px 40px; background-color:#EBEBEE; border-bottom:1px solid #CBCBCE; }
div.boksi hr { border:1px solid #aaa; height:1px; background-color:#aaa; }
div.boksi2 { border:none; background-image:url('../images/_quot2.png'); background-repeat:no-repeat; background-position:bottom right; width:100%; background-color:#EBEBEE; height:18px; }
input.nappi { color:#000; background-color:#eee; border:1px solid #000; margin:2px; padding:4px; }
div.boksi p { text-align:left; }
tr.email { display:none; }

div.shopblock {
float:left;
padding:5px;
margin:0px 15px 0px 0px;
}

div.shopblock img {
padding:5px;
border:2px solid #000;
background-color:#fff;
}

div.shopblock a:hover img {
background-color:#fee;
}

input.inp {
border:1px solid #000;
background-color:#fff;
padding:2px;
margin-bottom:2px;
}

input.inp:hover {
border:1px solid #000;
background-color:#fee;
}

div.pressboxh {
float:left; margin-right:10px; margin-bottom:10px; background-color:#eee; padding:10px; font-size:90%; border-bottom:1px solid #ddd; overflow:hidden;
}

div.pressboxh img, div.pressboxv img {
border:4px solid #fff;
}

div.pressboxh a:hover img, div.pressboxv a:hover img {
border:4px solid #ccc;
}

div.pressboxv { float:left; margin-right:10px; margin-bottom:10px; background-color:#eee; padding:10px; text-align:left; font-size:90%; border-bottom:1px solid #ddd; overflow:hidden; }

div.pressboxh img, div.pressboxv img { margin-right:5px; }

img.dots {
display: block;
margin-left: auto;
margin-right: auto;
width:100%;
max-width:498px;
height:auto;
min-width:1%;
}

img.dots img {

}

@media (max-width:768px) {
#pohja { padding-top:0; width:100%; min-width:1px; }
#cnt, #oline { width:100%;min-width:100%; }
#pallo { display:none; }
#logo img { display:inline; width:85%; max-width:85%; min-width:85%; margin:0; padding:0; }
#oline { margin:0; padding:0; overflow:hidden; }

#nav {
font-family:'po',sans-serif;
font-size:22px;
width:100%;
height:54px;
min-width:100%;
line-height:0;
padding-left:0;
z-index:100;
background-color:#C25B8E !important;
border-bottom:1px solid #B24B7E !important;
}

#nav > ul {
width:100%;
height:auto;
display:none;
position:absolute;
overflow:hidden;
border-bottom:2px solid #B24B7E;
}

#nav > a { margin-left:3%; }
#nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type { display:block; line-height:54px; padding:0; }
#nav:target > ul { display:block; width:100%; background-color:#C25B8E; z-index:100; }
#nav > ul > li { width:100%; float:none; }
#nav ul { list-style-type:none; padding-bottom:16px; background-color:#fff; }
#nav ul li a, #nav ul li a:link, #nav ul li a:active, #nav ul li a:visited { padding:10px; }
#nav ul li:hover { color:#000 !important; background-color:#E27BAE !important; }
#nav ul li { line-height:22px; padding:0; padding-left:15px; margin-bottom:4px; }
#nav ul li:hover ul { display:none; }
#nav a, #nav a:link, #nav a:active, #nav a:visited { background-color:transparent !important; }
#nav a:hover { background-color:#f0f; }

#sossut { position:absolute; top:0; right:0; }

#cmid, #cleft, #cright, #cmidwide, #cleftwide, { width:94% !important; float:none !important; margin:0 !important; clear:both; padding:10px 1% 10px 3%; }
#cmid, #cleft, #cright, #cmidwide, #cleftwide { margin-top:0; }
#cwide, #cwide2 { width:97% !important; max-width:99% !important; min-width:1%; background-image:none; padding-bottom:16px; margin-bottom:16px; }
#cleft { padding-top:0; }
#cleftwide { display:none; }
#cmidwide { padding-bottom:0; }

#cwide2 { padding:10px 1% 10px 3%; width:97%; margin-right:0; padding-right:0; }
#cmid { width:94%; overflow:hidden; }
#cright { width:94%; }

div.vidco { margin-right:0; padding-right:0; }
div.vidco iframe, div.vidco object, div.vidco embed { width:95%; height:95%; margin-right:0; padding-right:0; }

div.sivutus { width:92%; font-size:100%; color:#000; padding:0px 5px 5px 0px; margin:0; text-align:right; }
div.boksi { width:92%; font-size:90%; margin-left:0px; margin-right:0px; padding:8px 10px 5px 10px; }
div.boksi2 { background-position:bottom right; width:99%; background-color:#EBEBEE; height:18px; }
}

@media print {
body { margin:0; padding:0; width:99%; background-color:#fff; }
div.slid, #oline, #nav, #cleftwide, #fsossut, #footer, #ftext, #cleft, #cright, #cmidwide, .noprint, div.vidco { display:none; }
#cmid { border-top:none; }
#cleft, #cright { margin:0; padding:0; }
#cmid, #pohja, #cnt, #cwide, #cwide2 { margin:0; padding:0; display:block; float:none; }
#cmid { width:70%; }
#pohja { background-color:#fff; }
#cnt { width:100%; }
p, h1, h2, h3, h4, ul li, ol li { color:#000; }
p, ul li, ol li { font-size:12pt; }
h1 { font-size:19pt; letter-spacing:0.1em; }
h2.newsitem, h2.newsitem a { color:#000; text-decoration:none; }
a, a:link, a:active, a:visited { color:#000 !important; font-weight:normal !important; text-decoration:underline !important; }
}

