﻿@import url('https://fonts.googleapis.com/css?family=Mea+Culpa');
@import url('https://fonts.googleapis.com/css?family=Open+Sans');
@import url('https://fonts.googleapis.com/css?family=Bellefair');

img.galleria {
padding: 5px;
background-color: transparent;
border: 1px solid #eba19e;
}

::-moz-selection { color: #ffffff; background: #dbbabd; }
::selection { color: #ffffff; background: #dbbabd; }

::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: #dbbabd; }
::-webkit-scrollbar-thumb { background: #801922; }

html {
height: 100%;
}

body {
display: block;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
background: url(malva-tausta.jpg);
background-repeat: repeat;
}

div.box {
display: block;
background-color: #fafafa;
width: calc(100% - 200px);
max-width: 1200px;
padding: 0px 100px;
margin: 0 auto;
overflow: hidden;
min-height: 100%;
box-shadow: 0px 0px 6px #000000;
background-image: url(malva-vasen.jpg), url(malva-oikea.jpg);
background-position: left top, right top;
background-repeat: repeat-y, repeat-y;
}

div.container {
position: relative;
display: block;
background-color: transparent;
width: 92%;
padding: 2% 4%;
margin: 0;
overflow: hidden;
float: left;
min-height: 100%;
}

div.puoli {
display: inline-block;
float: left;
width: 50%;
margin: 0px 0px 50px 0px;
padding: 0px;
flex-wrap: wrap;
vertical-align: top;
}

div.nelja {
display: inline-block;
float: left;
width: 25%;
margin: 0px 0px 25px 0px;
padding: 0px;
flex-wrap: wrap;
vertical-align: top;
}

b, strong {
font-weight: normal;
color: #63262B;
text-shadow: 0px 0px 1px #63262B;
}

pm, pikkumusta {
font-size: 10px;
font-family: open sans;
}

pp, pikkupunainen {
font-size: 10px;
font-family: open sans;
color: #801922;
}

a:link, a:visited {
color: #801922;
text-decoration: none;
}

a:hover {
color: #63262B;
text-decoration: none;
}

h1 {
font-size: 58px;
font-family: mea culpa;
font-weight: normal;
color: #63262B;
padding: 0px 0px 30px 0px;
margin: 0px;
text-align: center;
line-height: normal;
}

h2::before {
content: "» ";
}

h2 {
font-size: 18px;
font-family: bellefair;
font-weight: normal;
color: #801922;
padding: 15px;
margin: 0px;
text-align: left;
line-height: normal;
text-transform: uppercase;
}

h3 {
font-size: 12px;
font-family: bellefair;
font-weight: 300;
color: #aaaaaa;
padding: 50px 0px 10px 0px;
margin: 0px;
text-align: center;
line-height: normal;
text-transform: uppercase;
}

p {
color: #000000;
font-family: open sans;
font-size: 13px;
text-align: justify;
line-height: 1.8;
}

/* Style the tab */
.tab {
overflow: hidden;
text-align: center;
}

/* Style the buttons that are used to open the tab content */
button.tablinks {
float: center;
border: none;
outline: none;
padding: 14px 16px;
font-family: bellefair;
font-size: 22px;
color: #63262B;
text-transform: uppercase;
background-color: transparent;
}

/* Change background color of buttons on hover */
button.tablinks:hover {
color: #801922;
}

/* Style the tab content */
.tabcontent {
display: none;
padding: 15px 0px;
border-top: none;
}

button.historia {
border: none;
outline: none;
background-color: transparent;
font-family: open sans;
font-size: 13px;
color: #63262B;
padding: 0;
margin: 0;
}

button.historia:hover {
color: #801922;
}