* {
  font-family: "Fira Sans", sans-serif;
  font-weight: 300;
  line-height: normal;
  font-size: 18px;
}

.button {
  width: 200px;
  height: 50px;
  border: black 1px solid;
  margin: 10px auto;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  color: black;
  background-color: white;
}

.social {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  margin-top: 100px;
}
.social a {
  margin: 50px 10px 10px 10px;
}

.social a i {
  height: 40px;
  width: 40px;
  border: 1px solid #111;
  line-height: 40px;
  color: #111;
  font-size: 20px;
  text-align: center;
}

.container {
  margin: 50px 70px 50px 70px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 90%;
  height: 650px;
}

.sample1 {
  margin-right: 50px;
  border: black 1px solid;
  height: 100%;
  background: url("../images/pug.png") no-repeat 40% 35%;
}

.sample2 {
  display: flex;
  flex-flow: column wrap;
}
.sample2 ul {
  margin-bottom: 50px;
}
.sample2 li {
  margin: 5px;
}

.imageSize {
  height: 450px;
}

.portfolio {
  margin-right: 50px;
  height: 100%;
  background-size: contain;
}

.work1 {
  border: black 1px solid;
  background: url("../images/work1.png") no-repeat 50%;
  background-size: contain;
}

.work2 {
  border: black 1px solid;
  background: url("../images/work2.png") no-repeat 50%;
  background-size: cover;
}

.work3 {
  border: black 1px solid;
  background: url("../images/work3.png") no-repeat;
  background-size: cover;
}

.work4 {
  border: black 1px solid;
  background: url("../images/work4.png") no-repeat;
  background-size: cover;
}

.work5 {
  border: black 1px solid;
  background: url("../images/work5.jpg") no-repeat;
  background-size: cover;
}

.work6 {
  border: black 1px solid;
  background: url("../images/work6.jpg") no-repeat;
  background-size: cover;
}

.work7 {
  border: black 1px solid;
  background: url("../images/work7.png") no-repeat;
  background-size: cover;
}

.nav-work {
  display: flex;
  flex-flow: row wrap;
  align-content: center;
  justify-content: end;
  margin: 5px 100px 5px 10px;
  padding: 5px;
}

.button-work {
  height: 50px;
  width: 50px;
  display: flex;
  margin: 10px;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  color: black;
  background-color: white;
}

.button-work:hover {
  color: #333333;
}

/*# sourceMappingURL=main.css.map */
