@charset "UTF-8";

html {
    height: 100%;
    width: 100%;
}
body {
    min-height: 80%;
    width: 80%;
}

h1 {
  display:block;
  font-size: 2em;
  margin-bottom: 0.17em;
  margin-left: 0;
  margin-right: 0;
  font-weight:500;
  color: white;

}

h2 {
  display:block;
  font-size: 2em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
  font-weight:500;
  color: white;

}
h3 {
  display:block;
  font-size: 3em;
  margin-bottom: 0.67em;
  margin-right: 0;
  font-weight:500;
  color: white;

}

h4 {
  display:block;
  font-size: 2em;
  margin-bottom: 0.67em;
  margin-right: 0;
  font-weight:500;
  color: black;

}

h5 {
  display:block;
  font-size: 2vw;
  margin-bottom: 0.67em;
  margin-right: 0;
  font-weight:500;
  color: white;

}

h6 {
  display:block;
  font-size: 1.5em;
  margin-bottom: 0.67em;
  margin-right: 0;
  font-weight:400;
  color: white;

}

a  { color:#FFFFFF; text-decoration: none;}

iframe:focus {
  outline: none;
}
        #page-perus { position: relative; width: 80%; margin-left: 30%; color: white;}
        #page-perusta { position: relative; width: 70%; margin-left: 30%; padding: 25px; color: black; background-color: silver; border-radius: 10px;}
        p { padding-left: 3cm; padding-right: 2cm; color: white;}
        
iframe[seamless] {
  display: block;
}

ul.dropdown {
 font-weight: normal;
}

	ul.dropdown li {
	 padding: 7px 10px;
	 border-color: #fff #d9d9d9 #d9d9d9;
	 background-color: #000;
	 color: #000;
	}

	ul.dropdown li.hover,
	ul.dropdown li:hover,
	ul.dropdown li.on {
	 background-color: #000;
	 color: #fff;
	}

	ul.dropdown a:link,
	ul.dropdown a:visited	{ color: #fff; text-decoration: none; }
	ul.dropdown a:hover		{ color: #fff; }
	ul.dropdown a:active	{ color: #fff; }


	/* -- level mark -- */

	ul.dropdown ul {
	 width: 150px;
	 margin-top: 1px;
	}

		ul.dropdown ul li {
		 font-weight: normal;
		}


/* -- Supporting class `dir` -- */

ul.dropdown *.dir {
 padding-right: 20px;
 background-image: url(../images/default/nav-arrow-down.png);
 background-position: 100% 50%;
 background-repeat: no-repeat;
}


/* -- Components override -- */

ul.dropdown-horizontal ul *.dir {
 padding-right: 15px;
 background-image: url(../images/default/nav-arrow-right.png);
 background-position: 100% 50%;
 background-repeat: no-repeat;
}

ul.dropdown-upward *.dir {
 background-image: url(../images/default/nav-arrow-top.png);
}

ul.dropdown-vertical *.dir,
ul.dropdown-upward ul *.dir {
 background-image: url(../images/default/nav-arrow-right.png);
}

ul.dropdown-vertical-rtl *.dir,
ul.dropdown-horizontal > li.dropdown-vertical-rtl ul *.dir {
 padding-right: 10px;
 padding-left: 15px;
 background-image: url(../images/default/nav-arrow-left.png);
 background-position: 2px 50%;
}

/* -- sijoituksia -- */

div.c2 {
	color: #fff;
	background: #000803;
    opacity:0.9;
    
	padding:20px;
	position: right;
	width:70%; 
	margin-left:auto;
    margin-top: 30%;

}


/* -- fontti -- */

@font-face {
	font-family: DejaVu;
	src: url(../fonts/DejaVuSans.ttf);

	}
    
.button {
  border: none;
  color: white;
  padding: 4px 15px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1vw;
  cursor: pointer;
}

.button1 {background-color: black;}
.button2 {background-color: #5f5f5f;} 
.button3 {background-color: #5e1f00;}

body, html {
background-attachment: fixed;
background-position: center;
background-color: black;
background-repeat: no-repeat;

 }
   
.arrow{
    position: absolute;
    top: 90%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.arrow span{
    display: block;
    width: 20px;
    height: 20px;
    border-bottom: 5px solid white;
    border-right: 5px solid white;
    transform: rotate(45deg);
    margin: -10px;
    animation: animate 3s infinite;
}
.arrow span:nth-child(2){
    animation-delay: -0.2s;
}
.arrow span:nth-child(3){
    animation-delay: -0.4s;
}
@keyframes animate {
    0%{
        opacity: 0;
        transform: rotate(45deg) translate(-20px,-20px);
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        transform: rotate(45deg) translate(20px,20px);
    }
}