.naree-container-bottom, .naree-container-top {
  position: relative;
  .naree-logo {
    position: absolute;
    z-index: 100;
  }

  .naree-logo-mobile {
    position: absolute;
    z-index: 100;
  }
}
.naree-container-top {

  @media only screen and (max-width: 991px) {
    height: 145px;
  }
  @media only screen and (max-width: 660px) {
    height: 102px;
  }
  .front & {

    .naree-logo {
      top: -330px;
      width: 130px;
      @media only screen and (max-width: 1560px) {
        top: -278px;
      }
      @media only screen and (max-width: 1199px) {
        top: -240px;
      }
      @media only screen and (max-width: 992px) {
        display: none;
      }
    }
  }
  .naree-logo {
    top: -251px;
    right: 0;
    width: 130px;
    @media only screen and (max-width: 1560px) {
      top: -234px;
    }
    @media only screen and (max-width: 1400px) {
      top: -251px;
    }
    @media only screen and (max-width: 1199px) {
      top: -251px;
    }
    @media only screen and (max-width: 991px) {
      display: none;
    }
  }

  .naree-logo-mobile {
    position: absolute;
    display: none;
    top: -16px;
    right: 0;
    left: 0;
    margin: auto;
    width: 450px;
    z-index: 100;
    padding-right: 10px;

    @media only screen and (max-width: 450px) {
      width: 220px;
      top: -11px;
    }

    @media only screen and (max-width: 660px) {
      width: 320px;
      top: -11px;
    }
    @media only screen and (max-width: 991px) {
      display: block;
    }
  }
}
.naree-container-bottom {
  .naree-logo {
    top: -40px;
    right: 0;
    width: 195px;
    @media only screen and (max-width: 992px) {
      display: none;
      width: 150px;
    }
  }

  .naree-logo-mobile {
    display: none;
  }
}
.naree-block {
  width: 818px;
  margin: auto;
  //border: 2px solid @brickgray;
  //padding: 3rem;
  text-align: center;
  position: relative;
  border: 2px solid transparent;
  -moz-border-image: -moz-linear-gradient(left, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
  -webkit-border-image: -webkit-linear-gradient(left, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
  border-image: linear-gradient(to right, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
  border-image-slice: 1;
  @media only screen and (max-width: 991px) {
    width: 100%;
  }
  .naree-block-wrapper {
   // border: 2px solid;
    //border-image: radial-gradient(rgba(255, 232, 146, 1), rgba(170, 126, 45, 1)) 1;
    //border-image: linear-gradient(to right, rgba(255, 232, 146, 1) , rgba(170, 126, 45, 1));
    padding: 3rem 3rem 2rem 3rem;
    &::before {
      content: " ";
      position: absolute;
      top: -1.8rem;
      left: 0;
      right: 0;
      background-color: @brickwhite;
      width: 258px;
      height: 30px;
      margin: auto;
      z-index: 1;
    }
  }
  .page-advertise & {
    margin-bottom: 125px;
    margin-top: 100px;
  }
  .page-about & {
    margin-bottom: 129px;
  }
  .naree-title {
    color: @brickred;
    font-size: 60px;
    line-height: 1.5em;
    letter-spacing: 8px;
    font-family: 'Steelfish', sans-serif;
    text-transform: uppercase;
  }
  .naree-award {
    font-size: 30px;
    font-weight: bold;
    font-family: 'Savoy', Georgia, serif;
    position: relative;
    &:before, &:after {
      height: 42px;
      width: 175px;
      content: '';
      position: absolute;
      top: 50%;
      //border-bottom: 2px solid @brickgray;
      background: url(/sites/all/themes/bootstrap_brick/images/naree/gold-line.png) no-repeat;
    }
    &:before {
      transform: translate(-175%, -50%);
    }
    &:after {
      transform: translate(72%,-50%);
    }
    p {
      background: rgba(255, 232, 146, 1);
      background: -moz-linear-gradient(-45deg, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
      background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(255, 232, 146, 1)), color-stop(55%, rgba(170, 126, 45, 1)), color-stop(100%, rgba(255, 232, 146, 1)));
      background: -webkit-linear-gradient(-45deg, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
      background: -o-linear-gradient(-45deg, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
      background: -ms-linear-gradient(-45deg, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
      background: linear-gradient(135deg, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe892', endColorstr='#ffe892', GradientType=1);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      max-width: 280px;
      margin: auto;
    }
  }
  .naree-name {
    font-size: 15px;
    color: @brickblack;
    line-height: 5rem;
    font-family: 'futura-pt', 'Futura', sans-serif;
    text-transform: uppercase;
    font-weight: bold;
  }
  &::before {
    content: "Brick Underground Named";
    color: @brickgray;
    font-family: 'Steelfish', sans-serif;
    font-size: 25px;
    text-transform: uppercase;
    letter-spacing: 3px;
    position: absolute;
    top: -1.8rem;
    left: 0;
    right: 0;
    background-color: white;
    width: 258px;
    margin: auto;
    background: rgba(255, 232, 146, 1);
    background: -moz-linear-gradient(-45deg, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
    background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(255, 232, 146, 1)), color-stop(55%, rgba(170, 126, 45, 1)), color-stop(100%, rgba(255, 232, 146, 1)));
    background: -webkit-linear-gradient(-45deg, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
    background: -o-linear-gradient(-45deg, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
    background: -ms-linear-gradient(-45deg, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
    background: linear-gradient(135deg, rgba(255, 232, 146, 1) 0%, rgba(170, 126, 45, 1) 55%, rgba(255, 232, 146, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe892', endColorstr='#ffe892', GradientType=1);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    z-index: 2;
  }
}