@import url('https://fonts.googleapis.com/css2?family=Milonga&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Glegoo&family=Roboto+Condensed:wght@300&display=swap');

a {
	color: #b19e46;
	transition: color 0.25s ease-out;
-webkit-transition: color 0.25s ease-out;
-moz-transition: color 0.25s ease-out;
-o-transition: color 0.25s ease-out;
}

a:hover {
color: #e51c50;
}

h1 {
font-size: 90px;
font-family: 'Milonga', cursive;
background: -webkit-linear-gradient(#efe06a, #815c0d);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
line-height: normal;
}

h2 {
font-size: 30px;
font-family: 'Milonga', cursive;
background: -webkit-linear-gradient(#efe06a, #815c0d);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
line-height: normal;
}

h3 {
font-size: 17px;
font-family: 'Glegoo', serif;
background: -webkit-linear-gradient(#efe06a, #815c0d);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
line-height: normal;
}

.quote {
	font-size: 15px;
	font-family: 'Glegoo', serif;
width: 100%;
color: #aa5a63;
}
body {
	font-size:100%;
	line-height:1.4em;
font-family: 'Roboto Condensed', sans-serif;
	color: #a8a38c;
	background: url(https://i.imgur.com/h1YFoJW.png),
		url(https://i.imgur.com/Vj9S3XL.png),
		linear-gradient(90deg, rgba(36,0,10,1) 0%, rgba(81,22,32,1) 35%, rgba(86,0,15,1) 100%);
background-repeat: no-repeat,
		no-repeat,
		repeat;
background-position: bottom right,
		top left,
		center;
}

#page_wrapper {
    width: 960px;
	margin: 0px auto;
	position: relative;
}

#header {
	margin-left: 400px;
padding-top: 30px;
	height: 250px;
}

#header_contents {
	margin: auto;
	position: relative;
}

#etuteksti {
	margin-left: 550px;
	height: 60px;
	background: -webkit-linear-gradient(#efe06a, #815c0d);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	line-height: normal;
	font-family: Georgia;
	font-size: 30px;
}


#tokateksti {
	margin-left: 650px;
	height: 60px;
	background: -webkit-linear-gradient(#efe06a, #815c0d);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	line-height: normal;
	font-family: Georgia;
	font-size: 30px;
}

#footer {
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 100px;
	width: 400px;
	height: 400px;
	color: white;

}


 .indexkuva {
	 width: 308px;
   -webkit-animation-name: kuv; /* Safari 4.0 - 8.0 */
   -webkit-animation-duration: 1s; /* Safari 4.0 - 8.0 */
   animation-name: kuv;
   animation-duration: 1s;
	  animation-iteration-count: 1;
 }


  .indexloota {
 	 width: 70%;
 background: url("https://i.imgur.com/bYJmGnr.png");
 border-radius: 10px;
 	 padding: 40px 10px 40px 10px;
 	 margin: 20px auto;
 	 min-height: 200px;
    -webkit-animation-name: example; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 1s; /* Safari 4.0 - 8.0 */
    animation-name: kuv;
    animation-duration: 1s;
 	  animation-iteration-count: 1;
  }

 /* Safari 4.0 - 8.0 */
 @-webkit-keyframes kuv {
   from {width: 0px;}
   to {width: 308px;}
 }

 /* Standard syntax */
 @keyframes kuv {
	 from {width: 0px;}
   to {width: 308px;}
 }

 .indexteksti {
   -webkit-animation-name: tekst; /* Safari 4.0 - 8.0 */
   -webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
   animation-name: tekst;
   animation-duration: 1.5s;
	  animation-iteration-count: 1;
 }

hr {
	background: url(https://i.imgur.com/TuZITj8.jpg);
	width: 80%;
	height: 1px;
	border: 0px;
}
