img {
    max-height: 75vh;
}

.side-by-side {
    display: flex;
    width: 100%;
}

.container p {
    max-width: 500px;
}

li {
    list-style-type: none;
}

/* LAYOUT PRESETS */

.l-1,
.l-2,
.l-3 {
    display: flex;
    flex-direction: column;
    height: 750px;
    width: 750px;
    overflow: hidden;
    border: 1px solid black;
    margin: 0 auto;
    padding: 5px;
}

.l-1 p,
.l-2 p,
.l-3 p {
    margin: 0;
}

.l-1 {
    font-family: "futura-pt-condensed", sans-serif;
    font-weight: 900;
    font-style: normal;
    font-size: 14px;
}

.l-2,
.l-3 {
    font-family: "Helvetica Neue", sans-serif;
    font-size: 13px;
}

.l-2 .centred p,
.l-3 .centred p {
    letter-spacing: 5.5px;
    padding: 25px 0 10px;
}

.centred p,
.centred {
    justify-self: center;
    text-align: center;
}

.bold {
    font-weight: 700;
}

.medium {
    font-weight: 500;
}

.regular {
    font-weight: 400;
}

.light {
    font-weight: 300;
}

.thin {
    font-weight: 200;
}

.ultra-light {
    font-weight: 100;
}

.italic {
    font-style: italic;
}

.horizontal {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.text-right {
    text-align: right;
}

/* LAYOUT 1 */

.l-1 {
    justify-content: space-between;
}

.l-1 .title {
    display: flex;
    justify-content: space-between;
}

.l-1 .spaced {
    letter-spacing: 3px;
}

.l-1 .tight {
    letter-spacing: -0.5px;
}

.l-1 .centred {
    justify-self: center;
    text-align: center;
}

.l-1 .info {
    position: relative;
    align-items: end;
}

.l-1 .info div:first-of-type {
    padding-right: 15px;
}

.l-1 .info p {
    padding-top: 4px;
}

.l-1 .special {
    position: absolute;
    left: calc(750px / 3);
    top: 150px;
}

.l-1 .right-col {
    width: calc(750px / 4);
}

.l-1 .spaced-justify {
    letter-spacing: 0.72px;
}

.l-1 .quarter {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: calc(750px / 4);
}

.l-1 .quarter:last-of-type {
    padding-top: 5px;
}

/* LAYOUT 2 */

.l-2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.l-2 .upper {
    align-self: flex-end;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.l-2 .upper .bold p:first-of-type {
    letter-spacing: 12.25px;
}

.l-2 .upper .r-90 {
    rotate: 90deg;
    width: 130px;
    padding-left: 5px;
    height: 145px;
    position: relative;
    right: 12px;
}

.l-2 .rainforest {
    padding-right: 12px;
}

.l-2 .rainforest .horizontal p:nth-of-type(2) {
    padding: 0 10px;
}

.l-2 .lower {
    display: flex;
    flex-direction: row;
    justify-content: end;
    position: relative;
}

.l-2 .lower .r-90 {
    rotate: 90deg;
    position: absolute;
    left: -70px;
    top: 100px;
}

.l-2 .lower .r-90 .horizontal {
    padding-top: 5px;
}

.l-2 .lower .right {
    height: 315px;
    width: 82%;
    padding-right: 12px;
}

.l-2 .lower .right p {
    padding-top: 14px;
}

.l-2 .text-right.ultra-light {
    position: relative;
    bottom: 197.5px;
}

/* LAYOUT 3 */

.l-3 {
    background-color: #54452F;
    color: #D4C8B6;
    padding: 20px;
    justify-content: space-between;
}

.f1 {
    font-size: 8px;
}

.f2 {
    font-size: 10px;
}

.f3 {
    font-size: 14px;
}

.f4 {
    font-size: 18px;
}

.f5 {
    font-size: 22.5px;
}

.f6 {
    font-size: 23.5px;
}

.f7 {
    font-size: 120px;
    line-height: 100px;
}

.l-3 .upper {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 15px 15px 0 15px;
}

.l-3 .upper .f7 {
    position: relative;
    bottom: 7px;
    right: 7px;
}

.l-3 .left {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.l-3 .left > div p {
    padding-top: 12px;
}

.l-3 .middle p {
    text-align: center;
    padding-top: 75px;
    position: relative;
    top: 15px;
}

.l-3 .right div:last-of-type {
    padding-top: 12px;
}

.l-3 .lower {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: flex-end;
}

.l-3 .lower .third {
    width: 189.75px;
    padding-right: 15px;
}

.l-3 .lower .third:first-of-type {
    padding-right: 60px;
}

.l-3 .lower .f2 {
    padding: 5px 0;
}