/* * {
  border: 1px solid rgb(0,0,0);
}*/

* {
  margin: 0;
  padding: 0;
}

* {
  box-sizing: border-box;
}

body {
  background: url("http://katrikoivula.com/savage/img/tausta-mini-2.png");
  background-size: content;
  background-attachment: fixed;
  /*background-size: contain;*/
  /*background-repeat: repeat-x;*/
  /*background-position: top center;*/
}

h1 {
  font-family: 'Baskerville', serif;
  color: white;
  background-color: black;
  font-size: 18px;
  height: 55px;
  width: 400px;
  padding: 6px;
  padding-top: 5px;
  font-weight: 100;
  letter-spacing: 0.2em;
  top: 645px;
  z-index: 1000;
  position: absolute;
  margin: auto;
  top: 550px;
  left: 0;
  right: 0;
  bottom: 0;
}

h3 {
font-family: 'Baskerville', serif;
color: white;
background-color: black;
font-size: 12px;
height: 27px;
width: 117px;
padding: 6px;
padding-top: 6px;
padding-top: 6px;
font-weight: 100;
letter-spacing: 0.2em;
z-index: 1000;
position: absolute;
margin: auto;
top: 670px;
left: 0;
right: 0;
bottom: 0;
}

h2 {
  font-family: 'Baskerville', serif;
  color: white;
  background-color: black;
  font-size: 10px;
  height: 35px;
  width: 100px;
  padding: 6px;
      padding-top: 6px;
  padding-top: 6px;
  font-weight: 100;
  letter-spacing: 0.2em;
  z-index: 1000;
  position: absolute;
  margin: auto;
  top: 740px;
  left: 0;
  right: 0;
  bottom: 0;
}

a {
  color: white;
}

img {
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 70px;
}

.front {
  text-align: center;
} */

#otsake {
  word-spacing: 2em;
}

/*
.valipalkki {
background-color: white;
height: 430px;
width: 430px;
top: 180px;
position: relative;
margin: auto;
background-color: black;
}
*/

@media only screen and (max-width: 1000px) {

body {
    /* animation: colorchange 50s;
     -webkit-animation: colorchange 50s infinite alternate;*/
     background: url("http://katrikoivula.com/savage/img/tausta-mini-2.png");
     background-size: content;
     background-attachment: fixed;
   }

   img {
     position: absolute;
     margin: auto;
     top: 0;
     left: 0;
     right: 0;
     bottom: 100px;
     height: 50%;
     width: 100%
   }

   h1 {
     font-family: 'Libre Baskerville', serif;
     color: white;
     background-color: black;
     font-size: 13px;
     height: 65px;
     width: 182px;
     padding: 6px;
     padding-top: 5px;
     font-weight: 100;
     letter-spacing: 0.2em;
     top: 570px;
     z-index: 1000;
     position: absolute;
     margin: auto;
     top: 450px;
     left: 0;
     right: 0;
     bottom: 0;
   }

   h3 {
     font-family: 'Libre Baskerville', serif;
     color: white;
     background-color: black;
     font-size: 10px;
     height: 15px;
     width: 94px;
     padding: 6px;
     padding-top: 2px;
     font-weight: 100;
     letter-spacing: 0.2em;
     z-index: 1000;
     position: absolute;
     margin: auto;
     top: 560px;
     left: 0;
     right: 0;
     bottom: 0;
   }

   h2 {
     font-family: 'Libre Baskerville', serif;
     color: white;
     background-color: black;
     font-size: 7px;
     height: 24px;
     width: 100px;
     padding: 6px;
     padding-top: 4px;
     font-weight: 100;
     letter-spacing: 0.2em;
     z-index: 1000;
     position: absolute;
     margin: auto;
     top: 630px;
     left: 0;
     right: 0;
     bottom: 0;
   }



   /* värinvaihto

   @keyframes colorchange
   {
     0%   {background: white;}
     25%  {background: #073642;}
     50%  {background: black;}
     75%  {background: white;}
     100% {background: #073642;}
   }

   @-webkit-keyframes colorchange
   {
     0%   {background: white;}
     25%  {background: #073642;}
     50%  {background: black;}
     75%  {background: white;}
     100% {background: #073642;}
   }