@font-face {
  font-family: 'Amithen';
  src: url("//www.ifloraimg.co.uk/kernel/client/images/fonts/amithen/bfont-full/amithen/webfonts/amithen.eot");
  src: url("//www.ifloraimg.co.uk/kernel/client/images/fonts/amithen/bfont-full/amithen/webfonts/amithen.eot?#iefix") format("embedded-opentype"), url("//www.ifloraimg.co.uk/kernel/client/images/fonts/amithen/bfont-full/amithen/webfonts/amithen.woff2") format("woff2"), url("//www.ifloraimg.co.uk/kernel/client/images/fonts/amithen/bfont-full/amithen/webfonts/amithen.woff") format("woff"), url("//www.ifloraimg.co.uk/kernel/client/images/fonts/amithen/bfont-full/amithen/webfonts/amithen.ttf") format("truetype"), url("//www.ifloraimg.co.uk/kernel/client/images/fonts/amithen/bfont-full/amithen/webfonts/amithen.svg#youworkforthem") format("svg");
  font-weight: normal;
  font-style: normal; }

.iframe {
  width: 100%;
  height: 840px;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15);
  margin: 20px 0; }
  @media screen and (min-width: 395px) {
    .iframe {
      height: 800px; } }
  @media screen and (min-width: 500px) {
    .iframe {
      height: 870px; } }

img {
  max-width: 100%; }

.inner {
  width: 90%;
  padding: 30px 5%;
  max-width: 1200px;
  margin: auto; }

.wrapper {
  max-width: 998px;
  margin: auto; }
  .wrapper p {
    font-family: 'HCo Gotham';
    font-weight: 400;
    font-size: 15px;
    line-height: 22px; }
  .wrapper .bold {
    font-family: 'HCo Gotham';
    font-weight: 500; }
  .wrapper button {
    background: #B49A4E;
    color: white;
    padding: 13px 30px;
    font-family: GothamBook, sans-serif;
    font-size: 16px;
    line-height: 15px;
    margin: 5px;
    cursor: pointer;
    position: relative;
    top: 0;
    -webkit-transition: all 0.1s;
    transition: all 0.1s;
    border: none; }
  .wrapper button:hover {
    background: #917c3d; }
  .wrapper button:active {
    top: 3px; }
  @media screen and (min-width: 1200px) {
    .wrapper p {
      font-size: 16px;
      line-height: 24px; } }
  .wrapper .headerr {
    background-image: url("../img/header-mobile.jpg");
    background-size: cover;
    background-position: right bottom;
    padding-bottom: 130px;
    padding-top: 20px;
    overflow: hidden; }
    .wrapper .headerr .inner-inner {
      margin-left: 0; }
      .wrapper .headerr .inner-inner h1 {
        font-family: 'HCo Gotham', sans-serif;
        font-weight: 400;
        color: white;
        margin-left: auto;
        margin-right: auto;
        font-size: 16px;
        line-height: 26px;
        position: relative;
        padding-left: 5px;
        max-width: 250px;
        margin-bottom: 20px; }
        .wrapper .headerr .inner-inner h1 span {
          font-family: 'Amithen', sans-serif;
          font-weight: 100;
          color: #D0B04E;
          font-size: 45px; }
        .wrapper .headerr .inner-inner h1 .last {
          text-align: right;
          line-height: 60px;
          padding-left: 20px; }
        .wrapper .headerr .inner-inner h1:before {
          content: "";
          position: absolute;
          background-size: contain;
          background-position: center;
          background-repeat: no-repeat;
          background-image: url("../img/open.svg");
          top: -10px;
          right: 100%;
          width: 25px;
          height: 25px; }
        .wrapper .headerr .inner-inner h1:after {
          content: "";
          position: absolute;
          background-size: contain;
          background-position: center;
          background-repeat: no-repeat;
          background-image: url("../img/close.svg");
          bottom: 40px;
          left: 98%;
          width: 25px;
          height: 25px; }
      .wrapper .headerr .inner-inner .sub p {
        font-size: 15px;
        color: white;
        text-align: center; }
    @media screen and (min-width: 580px) {
      .wrapper .headerr {
        padding-bottom: 0px; } }
    @media screen and (min-width: 1000px) {
      .wrapper .headerr {
        background-color: #402E48;
        background-image: url("../img/header-banner.jpg");
        background-size: auto 100%;
        background-repeat: no-repeat;
        background-position: right top; }
        .wrapper .headerr .inner-inner {
          width: 50%; } }
    @media screen and (min-width: 1280px) {
      .wrapper .headerr {
        padding-top: 0px;
        background-position: 15% top; }
        .wrapper .headerr .inner h1 {
          font-size: 24px;
          line-height: 40px;
          padding-left: 40px;
          max-width: 350px;
          margin-bottom: 20px; }
          .wrapper .headerr .inner h1 span {
            font-size: 60px; }
          .wrapper .headerr .inner h1 .last {
            line-height: 70px;
            padding-left: 30px; }
          .wrapper .headerr .inner h1:before {
            top: -10px;
            left: 0;
            width: 30px;
            height: 30px; }
          .wrapper .headerr .inner h1:after {
            bottom: 50px;
            right: 0;
            left: initial;
            width: 30px;
            height: 30px; }
        .wrapper .headerr .inner .sub p {
          font-size: 16px;
          line-height: 24px; } }
  .wrapper .main_body p {
    text-align: justify; }
  .wrapper .main_body .inner {
    padding-bottom: 0; }
  .wrapper .main_body h2 {
    text-align: center;
    margin-top: 4em;
    margin-bottom: 2em; }
    .wrapper .main_body h2 span {
      display: inline-block;
      font-family: 'Amithen', sans-serif;
      font-weight: 100;
      font-size: 40px;
      color: #B49A4E;
      background-image: url("../img/swipe.png");
      background-repeat: no-repeat;
      background-size: 100% 30px;
      background-position: bottom;
      text-align: center;
      padding-bottom: 20px; }
  .wrapper .main_body .flex .img {
    text-align: center;
    margin-bottom: 10px; }
  .wrapper .main_body .flex p {
    margin-top: 0; }
  @media screen and (min-width: 1000px) {
    .wrapper .main_body h2 {
      margin-top: 6em;
      margin-bottom: 4em; }
      .wrapper .main_body h2 span {
        font-size: 54px; }
    .wrapper .main_body .flex {
      display: -webkit-box;
      display: flex;
      -webkit-box-pack: justify;
              justify-content: space-between; }
      .wrapper .main_body .flex .img {
        width: 47%; }
      .wrapper .main_body .flex .text {
        width: 49%; }
        .wrapper .main_body .flex .text > :nth-child(2) {
          margin: 0; } }
  .wrapper .main_body .grid_flowers h3 {
    text-align: center;
    margin-bottom: 20px;
    margin-top: 40px; }
    .wrapper .main_body .grid_flowers h3 span {
      border-bottom: 10px solid #006256;
      font-family: 'HCo Gotham';
      font-weight: 500;
      font-size: 18px; }
  .wrapper .main_body .grid_flowers .sl h3 {
    margin-top: 0; }
  .wrapper .main_body .grid_flowers .img {
    text-align: center; }
  .wrapper .main_body .grid_flowers img {
    max-width: 330px;
    width: 100%; }
  @media screen and (min-width: 700px) {
    .wrapper .main_body .grid_flowers {
      display: grid;
      grid-template-columns: calc(50% - 20px) calc(50% - 20px);
      grid-column-gap: 40px;
      grid-row-gap: 15px; }
      .wrapper .main_body .grid_flowers .text.sl {
        -webkit-box-ordinal-group: 2;
                order: 1; }
      .wrapper .main_body .grid_flowers .text.bb {
        -webkit-box-ordinal-group: 5;
                order: 4; }
      .wrapper .main_body .grid_flowers .text.td {
        -webkit-box-ordinal-group: 6;
                order: 5; }
      .wrapper .main_body .grid_flowers .text.fi {
        -webkit-box-ordinal-group: 9;
                order: 8; }
      .wrapper .main_body .grid_flowers .text.ats {
        -webkit-box-ordinal-group: 10;
                order: 9; }
      .wrapper .main_body .grid_flowers .img {
        grid-row-end: span 2;
        max-width: 467px; }
        .wrapper .main_body .grid_flowers .img.sl {
          -webkit-box-ordinal-group: 3;
                  order: 2; }
        .wrapper .main_body .grid_flowers .img.bb {
          -webkit-box-ordinal-group: 4;
                  order: 3; }
        .wrapper .main_body .grid_flowers .img.td {
          -webkit-box-ordinal-group: 7;
                  order: 6; }
        .wrapper .main_body .grid_flowers .img.fi {
          -webkit-box-ordinal-group: 8;
                  order: 7; }
        .wrapper .main_body .grid_flowers .img.ats {
          -webkit-box-ordinal-group: 11;
                  order: 10; } }
  @media screen and (min-width: 1000px) {
    .wrapper .main_body .grid_flowers h3 {
      margin-bottom: 30px; }
      .wrapper .main_body .grid_flowers h3 span {
        border-bottom: 12px solid #006256;
        font-size: 22px; }
    .wrapper .main_body .grid_flowers p {
      line-height: 28px; }
    .wrapper .main_body .grid_flowers img {
      max-width: 467px; } }
  .wrapper .main_body .grid_quotes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    text-align: center; }
    .wrapper .main_body .grid_quotes > :nth-child(4n), .wrapper .main_body .grid_quotes > :nth-child(4n+1) {
      background-color: #EFEDF3; }
    .wrapper .main_body .grid_quotes > div {
      padding: 10px 5px;
      display: -webkit-box;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-direction: column;
      -webkit-box-pack: justify;
              justify-content: space-between; }
      .wrapper .main_body .grid_quotes > div p {
        font-family: 'HCo Gotham';
        font-weight: 500;
        font-size: 12px;
        text-align: center;
        margin-top: 0;
        line-height: 16px; }
      .wrapper .main_body .grid_quotes > div .author {
        font-family: 'Amithen', sans-serif;
        font-weight: 100;
        font-size: 20px;
        color: #B49A4E;
        margin-bottom: 0;
        margin-top: 10px;
        white-space: nowrap; }
    @media screen and (min-width: 500px) {
      .wrapper .main_body .grid_quotes {
        padding-bottom: 0;
        max-width: 1200px;
        padding-top: 0;
        margin: auto;
        grid-template-columns: 1fr 1fr 1fr; }
        .wrapper .main_body .grid_quotes > :nth-child(odd) {
          background-color: #EFEDF3; }
        .wrapper .main_body .grid_quotes > :nth-child(even) {
          background-color: white; } }
    @media screen and (min-width: 1000px) {
      .wrapper .main_body .grid_quotes > div {
        padding: 30px; }
        .wrapper .main_body .grid_quotes > div p {
          font-weight: 400;
          font-size: 22px;
          line-height: 24px; }
        .wrapper .main_body .grid_quotes > div .author {
          font-size: 30px;
          margin-bottom: 0;
          margin-top: 10px; } }
    @media screen and (min-width: 1100px) {
      .wrapper .main_body .grid_quotes > div {
        padding: 30px; } }
  .wrapper .footer_banner {
    background-image: url("../img/footer-mobile.jpg");
    background-position: right bottom;
    background-size: cover;
    padding-bottom: 260px;
    text-align: center; }
    .wrapper .footer_banner h2 {
      font-family: 'HCo Gotham', sans-serif;
      font-weight: 400;
      color: white;
      margin-left: auto;
      margin-right: auto;
      font-size: 12px;
      line-height: 26px;
      position: relative;
      padding-left: 5px;
      max-width: 263px;
      margin-bottom: 20px;
      text-align: left; }
      .wrapper .footer_banner h2 span {
        font-family: 'Amithen', sans-serif;
        font-weight: 100;
        color: #D0B04E;
        font-size: 34px;
        line-height: 40px;
        white-space: nowrap;
        position: relative;
        left: -20px; }
      .wrapper .footer_banner h2:before {
        content: "";
        position: absolute;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        background-image: url("../img/open.svg");
        top: -10px;
        right: 100%;
        width: 25px;
        height: 25px; }
      .wrapper .footer_banner h2:after {
        content: "";
        position: absolute;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        background-image: url("../img/close.svg");
        bottom: 30px;
        left: 100%;
        width: 25px;
        height: 25px; }
    @media screen and (min-width: 600px) {
      .wrapper .footer_banner {
        background-image: url("../img/footer-banner.jpg");
        background-position: 50% top;
        background-size: cover;
        padding-bottom: 0;
        text-align: center; }
        .wrapper .footer_banner .inner-inner {
          width: 70%;
          margin-left: 0;
          padding: 4% 0; } }
    @media screen and (min-width: 1000px) {
      .wrapper .footer_banner {
        background-position: 20% top;
        background-size: cover;
        padding-bottom: 0;
        text-align: center; }
        .wrapper .footer_banner .inner-inner {
          width: 70%;
          margin-left: 0;
          padding: 4% 0; }
        .wrapper .footer_banner h2 {
          font-size: 20px;
          line-height: 30px;
          padding-left: 50px;
          max-width: 410px;
          margin-bottom: 30px; }
          .wrapper .footer_banner h2 span {
            font-size: 60px;
            position: relative;
            line-height: 70px;
            left: -70px; }
          .wrapper .footer_banner h2:before {
            top: -20px;
            left: 0;
            width: 35px;
            height: 35px; }
          .wrapper .footer_banner h2:after {
            bottom: 50px;
            left: 104%;
            width: 35px;
            height: 35px; } }
    @media screen and (min-width: 1100px) {
      .wrapper .footer_banner {
        background-position: 10% top; } }
    @media screen and (min-width: 1200px) {
      .wrapper .footer_banner {
        background-position: 30% top; }
        .wrapper .footer_banner .inner-inner {
          width: 70%; } }
  .wrapper .discover {
    background: #F1F1F1; }
    .wrapper .discover h3 {
      font-size: 16px; }
    .wrapper .discover .grid {
      display: grid;
      grid-template-columns: 1fr;
      grid-column-gap: 20px; }
      .wrapper .discover .grid .post {
        text-align: center;
        display: grid;
        grid-template-rows: auto auto auto;
        margin-bottom: 30px; }
        .wrapper .discover .grid .post img {
          display: block;
          margin: auto; }
        .wrapper .discover .grid .post p {
          width: 80%;
          margin-left: 10%;
          margin-right: 10%; }
    @media screen and (min-width: 1000px) {
      .wrapper .discover h3 {
        font-size: 22px; }
      .wrapper .discover .grid {
        grid-template-columns: 1fr 1fr 1fr; } }

@media screen and (min-width: 760px) {
  .wrapper .inner {
    width: 90%;
    padding: 30px 0; } }
