.wrap {
  margin: 0 auto;
  width: 1300px;
  height: 3300px;
  overflow-y: hidden;
}

h1 {
  font-family: "mr-eaves-sans", sans-serif;
  font-style: normal;
  font-weight: 100;
  font-size: 2.7em;
  position: relative;
  top: -0.5em;
}

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

li a {
  display: inline;
  float: right;
  padding: 3px 64px 3px 63px;
  text-align: center;
}

nav {
  display: inline-block;
  position: relative;
  top: -1em;
  background-color: #d4ac8a;
  font-family: "mr-eaves-sans", sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 2em;
  text-align: center;
  width: 31.25em;
}

a:link {
  color: #000;
  text-decoration: none;
}

nav a:hover {
  background-color: #c79c74;
}

a:visited {
  color: #000;
  text-decoration: none;
}

article .intro{
  font-family: "mr-eaves-sans", sans-serif;
  font-style: normal;
  font-weight: 200;
  font-size: 1.2em;
  position: relative;
  top: 3.2em;
  margin-left: 0em;
  width: 34em;
}

article {
  font-family: "mr-eaves-sans", sans-serif;
  font-style: normal;
  font-weight: 200;
  font-size: 1.2em;
  position: relative;
  top: 3.2em;
  margin-left: 0em;
  width: 34em;
}

article p{
  margin-bottom: 10em;
}

.intro {
  position: relative;
  top: -3em;
  width: 34em;
}

h2 {
  display: inline-block;
  width: 25%;
  vertical-align: top;
  text-align: center;
}

.s1 {
  display: inline-block;
  width: 70%;
  vertical-align: top;
}

.s2 {
  display: inline-block;
  width: 70%;
  vertical-align: top;
}

.s3 {
  display: inline-block;
  width: 70%;
  vertical-align: top;
}

.s4 {
  display: inline-block;
  width: 70%;
  vertical-align: top;
}

.s5 {
  display: inline-block;
  width: 70%;
  vertical-align: top;
}

blockquote{
  font-family: "mr-eaves-sans", sans-serif;
  font-style: italic;
  font-weight: 100;
  font-size: 1.8em;
  width: 18em;
  color: #999;
  position: relative;
  margin-left: 0em;
  top: -4em;
}

.images {
  position: relative;
  top: -65em;
  left: -2em;
}

.calendar,
.calendar div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.calendar {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -65em;
  left: 23em;
}
.calendar .cal1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-140px) translateX(-85px);
}
.calendar .cal1 img {
  width: 100%;
  height: auto;
}

.couch,
.couch div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.couch {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -68.2em;
  left: 32.3em;
}
.couch .couch1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-140px) translateX(-25px);
}
.couch .couch1 img {
  width: 100%;
  height: auto;
}

.snack,
.snack div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.snack {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -71.5em;
  left: 23em;
}
.snack .snack1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-100px) translateX(10px);
}
.snack .snack1 img {
  width: 95%;
  height: auto;
}

.show,
.show div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.show {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -74.8em;
  left: 32.3em;
}
.show .show1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-94px) translateX(15px);
}
.show .show1 img {
  width: 110%;
  height: auto;
}

.binge,
.binge div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.binge {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -78em;
  left: 23em;
}
.binge .binge1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-95px) translateX(25px);
}
.binge .binge1 img {
  width: 100%;
  height: auto;
}

.greys,
.greys div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.greys {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -81.2em;
  left: 32.3em;
}
.greys .greys1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-93px) translateX(-15px);
}
.greys .greys1 img {
  width: 87%;
  height: auto;
}

.master,
.master div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.master {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -84.25em;
  left: 23em;
}
.master .master1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-95px) translateX(105px);
}
.master .master1 img {
  width: 55%;
  height: auto;
}

.office,
.office div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.office {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -87.5em;
  left: 32.3em;
}
.office .office1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-93px) translateX(-60px);
}
.office .office1 img {
  width: 110%;
  height: auto;
}

.parks,
.parks div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.parks {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -90.75em;
  left: 23em;
}
.parks .parks1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-40px) translateX(0px);
}
.parks .parks1 img {
  width: 100%;
  height: auto;
}

.ranch,
.ranch div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.ranch {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -75.35em;
  left: 32.3em;
}
.ranch .ranch1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-130px) translateX(68px);
}
.ranch .ranch1 img {
  width: 70%;
  height: auto;
}

.stranger,
.stranger div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.stranger {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -78.5em;
  left: 23em;
}
.stranger .stranger1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-125px) translateX(83px);
}
.stranger .stranger1 img {
  width: 65%;
  height: auto;
}

.kimmy,
.kimmy div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.kimmy {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -211.8em;
  left: 32.3em;
}
.kimmy .kimmy1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-128px) translateX(73px);
}
.kimmy .kimmy1 img {
  width: 130%;
  height: auto;
}

.orange,
.orange div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.orange {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -122.2em;
  left: 23em;
}
.orange .orange1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-94px) translateX(78px);
}
.orange .orange1 img {
  width: 65%;
  height: auto;
}

.that,
.that div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.that {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -144em;
  left: 32.3em;
}
.that .that1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-210px) translateX(50px);
}
.that .that1 img {
  width: 80%;
  height: auto;
}

.murder,
.murder div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.murder {
  transform: rotate(45deg) translateY(200px);
  position: relative;
  top: -258.5em;
  left: 23em;
}
.murder .murder1 {
  width: 455px;
  height: 455px;
  transform: rotate(-45deg) translateY(-95px) translateX(-35px);
}
.murder .murder1 img {
  width: 120%;
  height: auto;
}

h4 {
  position: relative;
  margin: 0 auto;
  background-color: #d4ac8a;
  font-family: "mr-eaves-sans", sans-serif;
  font-style: normal;
  font-weight: 100;
  font-size: 2em;
  text-align: center;
  width: 31.25em;
  bottom: 85em;
  left: -6em;
}