@font-face {
  font-family: "Cormorant";
  src: url("res/fonts/Cormorant-Regular.ttf") format("opentype");
}
@font-face {
  font-family: "Ubuntu";
  src: url("res/fonts/Ubuntu-Regular.ttf") format("opentype");
}

html {
  background-color: #baa990;
  font-family: "Ubuntu";
}

body {
  display: flex;
  flex-flow: column nowrap;
  color: white;
}

a {
  color: white;
}

a:hover {
  color: #666;
}

/** NAVBAR */
nav {
  background-color: rgba(0, 0, 0, 0.4);
  position: fixed;
  width: 100%;
  z-index: 1;
}

nav .nav {
  display: flex;
  justify-content: flex-end;
  margin: 0 auto;
  width: 80%;
}

nav span {
  color: white;
  font-size: 2em;
  font-family: "Cormorant", serif;
  padding: 10px;
}
nav span:first-child {
  margin-right: auto;
}

nav span a {
  color: white;
  text-decoration: none;
}

nav span a:hover {
  color: #666;
}

/** MAIN */
.main {
  position: relative;
  width: 100%;
}

.content {
  width: 50vw;
  margin: 0 auto;
}

#landing {
  align-items: flex-end;
  background: url("background.jpg");
  background-color: rgba(0, 0, 0, 0.3);
  background-blend-mode: luminosity;
  background-size: auto 100%;
  background-repeat: no-repeat;
  color: white;
  display: flex;
  font-family: "Cormorant";
  height: 100vh;
  justify-content: flex-start;
}

#landing .text {
  background-color: rgba(0, 0, 0, 0.6);
  margin-bottom: 5%;
  font-size: 3em;
  width: 100%;
  padding: 20px;
}

#landing .subtitle {
  font-size: 0.5em;
}

h2 {
  font-family: "Cormorant";
  font-size: 3em;
  text-align: center;
}

h3 {
  font-family: "Cormorant";
  font-size: 2em;
}

.images {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
}

.images img {
  cursor: pointer;
  object-fit: cover;
}

#meie .images img {
  flex-basis: 13%;
  width: 13%;
}

#sport .images img {
  flex-basis: 15%;
  width: 15%;
}

.peamaja .images img {
  flex-basis: 11.5%;
  width: 11.5%;
}

.kaminamaja .images img {
  flex-basis: 9%;
  width: 9%;
}

.vaikemaja .images img {
  flex-basis: 32%;
  width: 32%;
}

.vanamaja .images img {
  flex-basis: 19%;
  width: 19%;
}

#hinnad table {
  margin: 0 auto;
}

#hinnad .desc {
  text-align: center;
}

#hinnad table td {
  padding: 0 10px;
}

.kontakt {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  margin: 0 auto;
  width: 70%;
}

footer {
  border-top: 1px solid #eee;
  margin-top: 10px;
  padding: 10px 0;
  text-align: center;
}

@media (max-width: 1200px) {
  .content {
    width: initial;
    margin: 0 20px;
  }
}

@media (max-width: 800px) {
  nav .nav {
    width: 100%;
  }
  nav span {
    font-size: 1.5em;
  }
  #landing .text {
    font-size: 2em;
  }
}