body  {
  padding:0px;
  background-color:#f9f9f9 ;
  color:#44e ;
  font-family:Monospace ;
  font-size:18px ;
  line-height:1.5em ;
  margin:0 ;
  letter-spacing: .10em;
}
html      {
  overflow-y: scroll;
}

body p	 	{
  line-height:1.6em ;
}
/* @media(min-width:1080px) {
  body p {
    font-size:4vw ;
  }
} */

body a    {
  text-decoration:none ;
  color:inherit ;
  outline:none ;
}

p 			  {
  margin:0px 0px ;
}

.hello {
  padding:15px 0px 15px 3%;
}

.alue     {
  width:100%;
}

.kortti   {
  background:#747 ;
  /* background-color:#7a70ea; */
  color:#eee ;
  float:left;
  padding:20px;
  border-radius:5px;
  width: 280px;
  margin: 2%;
  overflow: hidden;
  white-space: nowrap;
}

.contact a {
  text-decoration: none;
  color: #eee;
}

@media(max-width:1080px) {
  .kortti {
    width: 48%;
    min-width: 256px;
    margin: 1%;
  }

}


.tyyli {
  margin: 0% 0%;
}

@media(min-width:768px) {
  p, .kortti p, body p {
    font-size:18px ;
  }
  .tyyli {
    margin: 0% 10%;
  }

}
@media(max-width:630px) {
  #br {display: none;}

  .alue     {
    width:100%;
  }
  .hello {
    padding:5px 0px 5px 20px;
  }
  .kortti   {
    width: 100%;
    min-width: 120px;
    margin: 0%;
  }
  .kortti-bottom {
    background-color: red;
    margin-top: 10px;
  }
  p, .kortti p, body p {
    font-size:4vw ;
  }
}
@media(max-width:333px) {
  p, .kortti p, body p {
    letter-spacing: .05em;
  }
  .kortti, .hello   {
    padding:15px;
  }
}
