body {
background-image: url('../../../backgrounds/garden.png');
background-attachment: fixed;
background-repeat: repeat;
background-size: cover;
background-position: center center;
image-rendering: pixelated;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

/* -------- content --------- */

.container {
    display: grid;
    grid-template-columns: 280px 280px 540px 285px 285px;
    grid-template-rows: 130px 705px 60px;
    margin: auto;
    color: rgb(0, 0, 0);
    font-family: Tahoma, sans-serif;
    image-rendering: auto;
}

.title {
    grid-column: 3 / 4;
    grid-row: 1 / 2;
    z-index: 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 45px;
    color: #b63030;
    filter: drop-shadow(0 0 25px #d2e4ba9a);
}

#dangle {
    width: 79px;
    height: auto;
    image-rendering: pixelated;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    margin-left: 8px;
}

.poem {
    grid-column: 3 / 4;
    grid-row: 2 / 3;
    background-color: #c9e0afc9;
    border: double 3px #516d31cc;
    border-radius: 7px;
    margin-bottom: 8px;
}

/* -------- flowers lhs --------- */

.flowers-lhs1 {
    grid-column: 1 / 2;
    grid-row: 1 / 4;
    color: white;
    font-size: 25px;
    font-family: 'Times New Roman', Times, serif;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    position: relative;
    margin: 0 10px 0 10px;
}

.flowers-lhs1 img, .flowers-lhs2 img {
    width: 220px;
    height: auto;
}

.free {
    position: absolute;
    top: 139px;
    filter: drop-shadow(0 0 6px rgb(0, 0, 0));
}

.in-another-life {
    position: absolute;
    top: 433px;
    filter: drop-shadow(0 0 6px rgb(0, 0, 0));
}

.wish {
    position: absolute;
    bottom: 130px;
    filter: drop-shadow(0 0 6px rgb(0, 0, 0));
}

/* -------------------------------- */

.flowers-lhs2 {
    grid-column: 2 / 3;
    grid-row: 1 / 4;
    color: white;
    font-size: 25px;
    font-family: 'Times New Roman', Times, serif;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    position: relative;
    margin: 0 40px 0 10px;
}

.april {
    position: absolute;
    top: 248px;
    filter: drop-shadow(0 0 6px rgb(0, 0, 0));
}

.per {
    position: absolute;
    bottom: 258px;
    filter: drop-shadow(0 0 6px rgb(0, 0, 0));
}

.flowers-lhs1 a:link , .flowers-lhs2 a:link , .flowers-rhs1 a:link, .flowers-rhs2 a:link {
    text-decoration: none;
    color: #ffffff;
}

.flowers-lhs1 a:visited, .flowers-lhs2 a:visited, .flowers-rhs1 a:visited, .flowers-rhs2 a:visited {
  color: #ffffff;
}

.flowers-lhs1 a:hover, .flowers-lhs2 a:hover, .flowers-rhs1 a:hover, .flowers-rhs2 a:hover {
  color: #e2ffbc;
  text-decoration: underline;
}

.flowers-lhs1 a:active, .flowers-lhs2 a:active, .flowers-rhs1 a:active, .flowers-rhs2 a:active {
    text-decoration: none;
    color: #2e9100;
}

/* -------------------------------- */

.more {
    position: absolute;
    top: 235px;
    filter: drop-shadow(0 0 6px rgb(0, 0, 0));
}

.hbd-mackie {
    position: absolute;
    bottom: 225px;
    filter: drop-shadow(0 0 6px rgb(0, 0, 0));
}

/* -------------------------------- */

.collection {
    position: absolute;
    top: 146px;
    filter: drop-shadow(0 0 6px rgb(0, 0, 0));
}

.seams {
    position: absolute;
    top: 414px;
    filter: drop-shadow(0 0 6px rgb(0, 0, 0));
}

.mother-waits {
    position: absolute;
    bottom: 135px;
    filter: drop-shadow(0 0 6px rgb(0, 0, 0));
}

/* -------- flowers rhs --------- */

.flowers-rhs1 {
    grid-column: 4 / 5;
    grid-row: 1 / 4;
    color: white;
    font-size: 25px;
    font-family: 'Times New Roman', Times, serif;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    position: relative;
    margin: 0 10px 0 40px;
}

.flowers-rhs2 {
    grid-column: 5 / 6;
    grid-row: 1 / 4;
    color: white;
    font-size: 25px;
    font-family: 'Times New Roman', Times, serif;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    position: relative;
    margin: 0 10px 0 10px;
}

.flowers-lhs1 img, .flowers-lhs2 img, .flowers-rhs1 img, .flowers-rhs2 img {
    width: 220px;
    height: auto;
}

/* -------- footer --------- */

.footer {
    background-image: linear-gradient(#afe0bb, #71b94f);
    grid-column: 3 / 4;
    grid-row: 3 / 4;
    text-align: center;
    border-radius: 9px;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.6;
    color: #000000;
    image-rendering: auto;
}

#noteimg {
    height: 18px;
    width: auto;
}

#footerimg {
    height: 18px;
    width: auto;
    padding-left: 5px;
}

p.footer {
    margin-top: 8px;
}

.footer a:link {
    text-decoration: none;
    color: #000000;
}

.footer a:visited {
    color: #000000;
}

.footer a:hover {
    color:#e2ffdf;
    text-decoration: underline;
}

.footer a:active {
    color:#13a300;
    text-decoration: underline;
}