/*Nettisivun taustaväri*/
body {
  background-color:lightgreen;
  ;
}
/*Logo on asetettu niin, että se pysyy aina keskellä.*/
#logo {
  margin-top:0px;
  margin-left:auto;
  margin-right:auto;
  width: 500px;
}
/*Nappi joka viel peliportaaliin */
#portal {
  background-color: navy;
  color: white;
  padding: 15px 25px;
  margin: 5px;
  text-align: center;
  text-decoration: none;
  display:inline-block;
  box-shadow: gray 5px 5px;
  cursor:pointer;
}
/*Navigointipalkki koka seuraa scrollattaessa alaspäin*/
.menubar {
  position:sticky;
  display:inline-block;
  top: 0;
  background-color: lightblue; 
  border: 5px solid black;
  margin: 10px;
  padding: 10px;
  text-decoration: none;
}
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-decoration: none;
}
a {
  color:azure;
  text-decoration: none;
}
/*Kursorin mentäessä navigointipalkkin vaihtoehtojen ylle, valintanappulan väri
  muuttuu vaaleammaksi siniseksi ja kursorista muodostuu käsi.*/
.menubar li {
  background-color: navy;
  color: white;
  padding: 15px 25px;
  margin: 5px;
  text-align: center;
  text-decoration: none;
  display:inline-block;
  box-shadow: gray 5px 5px;
  cursor:pointer;
}
.menubar li:hover {
  background-color: #1111aa;
}
#language {
  background-color: navy;
  color: white;
  padding: 15px 25px;
  margin: 5px;
  text-align: center;
  text-decoration: none;
  display:inline-block;
  box-shadow: gray 5px 5px;
  cursor:pointer;
}
#language:hover {
  background-color: #1111aa;
}
/*Otsikot*/
h1 {
  font-family:'Courier New', Courier, monospace;
  color: hsl(225, 100%, 27%);
  border-top: 5px solid black;
  border-bottom: 5px solid black;
  background-color:azure;
  padding:20px;
  text-align:center;
}
h3 {
  font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  color: hsl(225, 100%, 27%);
}
/*Leipäteksti*/
p {
  font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  color:black;
}
/*Kuvaus-osion laatikko.*/
#description {
  display: inline-block;
  background-color: lightblue;
  border: 10px solid navy;
  padding: 20px;
  margin: 25px 25px 25px 25px;
  box-shadow: 10px 10px 5px gray;
}
/*Tekijät-osion laatikko.*/
#teamgrid {
  display: inline-block;
  background-color: lightblue;
  border: 10px solid navy;
  padding: 20px;
  margin: 25px 25px 25px 25px;
  box-shadow: 10px 10px 5px gray;
  text-align: center;
}

#ilmari {
  display: inline-block;
  padding:20px;
}
#marko {
  display: inline-block;
  padding:20px;
}
#joonas {
  display: inline-block;
  padding:20px;
}
#siiri {
  display: inline-block;
  padding:20px;
}
/*Traileri-osion laatikko*/
#trailer {
  display: inline-block;
  background-color: lightblue;
  border: 10px solid navy;
  padding: 20px;
  margin: 25px 25px 25px 25px;
  box-shadow: 10px 10px 5px gray;
}
#pitch {
  display: inline-block;
  background-color: lightblue;
  border: 10px solid navy;
  padding: 20px;
  margin: 25px 25px 25px 25px;
  box-shadow: 10px 10px 5px gray;
}
/*Art-osion laatikko*/
#artgallery {
  display: inline-block;
  background-color: lightblue;
  border: 10px solid navy;
  padding: 20px;
  margin: 25px 25px 25px 25px;
  box-shadow: 10px 10px 5px gray;
}
#artgallery img {
  float:left;
  background-color:white;
  border:5px solid black;
  height:20%;
  width:20%
}
#partners {
  background-color: lightblue;
}
#partners img {
  float:left;
  block-size:110px;
}
#end {
  margin:100px;
}
/*Isommalla screenillä laatikkoelementtien marginaalit ovat hiukan isommat.*/
@media screen and (min-width: 600px) {
  #artgallery {
    margin: 50px 50px 50px 50px
  }
  #trailer {
    margin: 50px 50px 50px 50px;
    width:"600"; 
    height:"450";
  }
  #pitch {
    margin: 50px 50px 50px 50px;
    width:"600"; 
    height:"450";
  }
  #description {
    margin: 50px 50px 50px 50px;
  }
  #teamgrid {
    margin: 50px 50px 50px 50px;
  }
  .menubar {
    margin: 0px 0px 0px 50px;
  }
  #partners {
    float:center;
  }
  #partners img {
    float:center;
    block-size:250px;
  }
}