@media screen and (max-width: 767px) {
  img,
  img.pull-right,
  img.pull-left {
    display: block;
    margin: 1em auto;
    float: none !important;
  }
}

@media screen and (min-width: 768px) {
  #contact-header {
    background: transparent;
    float: right;
    border-bottom: 0;
    margin-top: 5px; 
    padding-right: 1em;
    font-size: 100%;
    line-height: 100%;
  z-index: 1100;
  }

  #contact-header a {
    font-size: 100%;
    line-height: 100%;
  }

  #social-media {
    top: 4em;
    width: auto;
  }

  #facebook, #instagram {
    margin-bottom: 0;
  } 

  .navbar-default .navbar-nav > li > a {
    font-size: 100%;
    line-height: 100%;
  }

  #quick-links {
    background-color: #423400;
    background-image: url('../img/bannerBg.png');
    margin-left: -15px;
    margin-right: -15px;
    position: relative;
    min-height: 21em;
    background-size: 102px 100%;
    font-size: 75%;
  }

  #quick-links::before {
    display: none;
  }

  #quick-links::after {
    content: '';
    top: 1em;
    left: 1em;
    bottom: 1em;
    width: 573px;
    position: absolute;
    right: 50%;
    background-image: url(../img/front.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    max-width: 60%;
    background-size: contain;
  }

  #quick-links > ul {
    position: absolute;
    right: 1em;
    top: 1em;
    background-image: linear-gradient(135deg, white 0%, white 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%), linear-gradient(-135deg, white 0%, white 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%), linear-gradient(45deg, white 0%, white 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%), linear-gradient(-45deg, white 0%, white 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%), linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%), linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
    background-position: top center, top center, bottom center, bottom center, top center, bottom center;
    background-size: 0.75rem 0.75rem, 0.75rem 0.75rem, 0.75rem 0.75rem, 0.75rem 0.75rem, 100% 1rem, 100% 1rem;
    background-repeat: repeat-x;
    padding: 0.7rem 0;
    background-position: bottom center, bottom center, top center, top center, bottom center, top center;
  }

  #quick-links li {
    background-color: #fff;
    padding-bottom: 1px;
    border-bottom: 1px dashed #ccc;
  }

  #quick-links a {
    padding-right: 2em;
    position: relative;
  }

  #quick-links a::after {
    content: '';
    width: 1em;
    height: 2em;
    background-image: url('../img/arrow.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    position: absolute;
    right: 0;
    top: calc(50% - 1em);
  }
}

@media screen and (min-width: 992px) {
  #contact-header #contact-tel,
  #contact-header a {
    display: block;
    line-height: 140%;
    text-align: right;
  }

  #social-media {
    bottom: calc(0.5em + 15px);
    top: initial;
  }

  #quick-links {
    font-size: 100%;
  }
}

