
* {
  box-sizing: border-box;
  }
body
{
	text-align: justify;
	background: url(http://jodochus.net/bel/k/raita.jpg) fixed; 
	font-size: 12pt;
	  font-family: 'Oranienbaum', serif;
	letter-spacing: 0px;
	color: #000000;
	line-height: 16px;
	cursor: default;
}


.main {   

	width: 80%;
	position: relative;
	margin: auto;
	border: #39597b 0px dashed;
	box-shadow: 0px 0px 20px #665b46;
	  font-family: 'Oranienbaum', serif;
	color: #000000;
	line-height: 16px;
	text-align: justify;
	cursor: default;

}
.container{
display: flex;
  flex-direction: row;
	position: relative;
	margin: auto;
	width: 100%; 
	border: 0px solid;
}

.column1 {
  float: left;
	  font-family: 'Oranienbaum', serif;
	font-size:12pt;
	color:#171916;
	font-weight:500;
	line-height:20px;
  width: 35%;
  background: #324754 url(http://jodochus.net/bel/k/raita.png);
  padding: 35px;
}

.column2 {
  float: left;
  width: 65%;
  background: #f4f2f1;
	  font-family: 'Oranienbaum', serif;
	font-size:11pt;
	color:#171916;
	font-weight:500;
	line-height:20px;
  padding: 35px;
}

.container:after {
  content: "";
  display: table;
  clear: both;
}
.paikky {
  width: 99%;
  height: 350px;
  overflow: auto;
}
.white{
	font-family: 'Baskervville', serif;
	font-size: 13pt;
	color: #333333;
	font-style: normal;
	line-height: 23px;
	text-align: justify;
	cursor: default;

}

.sepia {
box-shadow: 0px 2px 15px #665b46;
  filter: opacity(70%) saturate(20%) sepia(80%);
}


.hr {
	border: 1px dashed #eaeaea;
}
.i{
	letter-spacing:1px;
	font-family: 'Baskervville', serif;
	font-size: 12pt;
	color: #999999;
	font-style: normal;
	line-height: 23px;
	text-align: justify;
	cursor: default;

}
.txt{
  font-family: 'Baskervville', serif;
	font-size: 13pt;
	color: #333333;
	font-style: normal;
	line-height: 23px;
	text-align: justify;
	cursor: default;

}
.txt2{
  font-family: 'Oranienbaum', serif;
	font-size: 12pt;
	color: #333333;
	font-style: normal;
	line-height: 23px;
	text-transform:uppercase;
	text-align: center;
	cursor: default;

}
.txt3{
  font-family: 'Oranienbaum', serif;
	font-size: 12pt;
	color: #333333;
	font-style: normal;
	line-height: 23px;
	text-align: justify;
	cursor: default;

}

.h2 {
	font-family: 'Oranienbaum', serif;
	font-size: 55pt;
	color: #333333;
	line-height: 23px;
	letter-spacing: 6px;
	text-align: center;
	cursor: default;
	padding:40px 0px 10px 0px;
	text-shadow: 1px 1px #ffffff;

}

.h2p {
	text-align:center;
	font-family: 'MonteCarlo', cursive;    
    font-size:55pt; 
    text-shadow: 0px 0px 6px #333333;
    letter-spacing:1px;
	line-height:35px;
    color:#4a6e87; 
    font-weight:200;

}
.h3{
    font-family: 'Oranienbaum', serif;
	font-size: 20pt;
	color: #333333;
	font-style: normal;
	line-height: 23px;
	text-transform:uppercase;
	text-align: center;
	cursor: default;
	padding:8px 0px 8px 0px;

}

.haka
{
	font-family: Times New Roman;
	font-size: 4em; 
	color:#323227; 
	text-align:left;
}
.pikkuhaka
{
	font-family: Times New Roman;
	font-size: 2em; 
	color:#323227; 
	text-align:center;
}


A:link{color:#423720;text-decoration:underline;cursor:hand;font-weight:bold;}
A:visited{color:#423720;text-decoration:underline;cursor:hand;font-weight:bold;}
A:active{color:#675c47;text-decoration:none;cursor:hand;font-weight:bold;}
A:hover{color:#675c47;text-decoration:none;cursor:hand;font-weight:bold;transition: all .3s linear;
}
/* latin-ext */
@font-face {
  font-family: 'Baskervville';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Baskervville Regular'), local('Baskervville-Regular'), url(https://fonts.gstatic.com/s/baskervville/v1/YA9Ur0yU4l_XOrogbkun3kQQvpmptvY.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Baskervville';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Baskervville Regular'), local('Baskervville-Regular'), url(https://fonts.gstatic.com/s/baskervville/v1/YA9Ur0yU4l_XOrogbkun3kQQsJmp.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Oranienbaum';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Oranienbaum'), local('Oranienbaum-Regular'), url(https://fonts.gstatic.com/s/oranienbaum/v8/OZpHg_txtzZKMuXLIVrx-0zt5E3Hdg.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Oranienbaum';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Oranienbaum'), local('Oranienbaum-Regular'), url(https://fonts.gstatic.com/s/oranienbaum/v8/OZpHg_txtzZKMuXLIVrx-0zk5E3Hdg.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Oranienbaum';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Oranienbaum'), local('Oranienbaum-Regular'), url(https://fonts.gstatic.com/s/oranienbaum/v8/OZpHg_txtzZKMuXLIVrx-0zu5E3Hdg.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Oranienbaum';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Oranienbaum'), local('Oranienbaum-Regular'), url(https://fonts.gstatic.com/s/oranienbaum/v8/OZpHg_txtzZKMuXLIVrx-0zg5E0.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Great Vibes';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Great Vibes'), local('GreatVibes-Regular'), url(https://fonts.gstatic.com/s/greatvibes/v7/RWmMoKWR9v4ksMfaWd_JN9XLiaQ6DQ.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Great Vibes';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Great Vibes'), local('GreatVibes-Regular'), url(https://fonts.gstatic.com/s/greatvibes/v7/RWmMoKWR9v4ksMfaWd_JN9XFiaQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}


.image
{
	border: 4px solid #eaeaea;
}
@media screen and (max-width: 700px) {
  .main{
    width: 96%;
  }
  .container {
    flex-direction: column;
  }
  .column1 {
    width: 100%;
    display: block;
  }
  .column2 {
    width: 100%;
    display: block;
  }
  .white, .txt {
  font-size:12pt;
   }
  .txt2, .txt3 {
  font-size:11pt;
   }
  .h2 {
  font-size:39pt;
  }
  .pikkuhaka {
  font-size:1em;
  }
  .haka {
  font-size:2em;
}