/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}

/* ================= SSF refinements ================= */

/* Header phone sits in line with the nav, not shouting over it */
.header .ssf-headtel a { font-size: 15px !important; font-weight: 600 !important; letter-spacing: .01em; }
.header .ssf-headtel { font-size: 13px !important; }

/* Solid white buttons on dark sections need readable text */
.dark .button.white:not(.is-outline),
.dark .button.white:not(.is-outline) span,
.ssf-cta .button.white:not(.is-outline),
.ssf-cta .button.white:not(.is-outline) span { color: #0077B6 !important; }
.dark .button.white:not(.is-outline):hover { background-color: #eef6fb !important; border-color: #eef6fb !important; }

/* Service area cards */
.ssf-areas .row { align-items: stretch; }
.ssf-areas .ssf-area-card { display: flex; }
.ssf-areas .ssf-area-card .col-inner {
  width: 100%;
  background: #fff;
  border: 1px solid #e4eaee;
  border-radius: 10px;
  padding: 30px 28px;
  box-shadow: 0 1px 2px rgba(16,32,44,.05);
  transition: box-shadow .22s ease, transform .22s ease;
}
.ssf-areas .ssf-area-card .col-inner:hover {
  box-shadow: 0 12px 26px rgba(16,32,44,.10);
  transform: translateY(-2px);
}
.ssf-areas .ssf-area-card h3 {
  font-size: 20px;
  margin: 0;
  padding-bottom: 12px;
  border-bottom: 3px solid #0077B6;
  display: inline-block;
}
.ssf-areas .ssf-area-note { font-size: 14px; color: #6b7a85; margin: 14px 0 12px; }
.ssf-areas .ssf-suburbs { font-size: 15px; line-height: 1.9; color: #3c4a55; margin: 0; }
.ssf-areas .ssf-area-more { color: #6b7a85; margin-bottom: 18px; }
.ssf-areas .row + .row { margin-top: 36px; }
@media (max-width: 549px) {
  .ssf-areas .ssf-area-card .col-inner { padding: 24px 22px; }
  .ssf-areas .ssf-suburbs { font-size: 14px; }
}

/* Quote form blocks: the Gravity Forms wrapper is the card, just lift it and stop the short column stretching */
.ssf-form-card .gform_wrapper {
  box-shadow: 0 12px 34px rgba(16,32,44,.08);
}
.ssf-form-card, .ssf-form-copy { align-self: flex-start; }
@media (min-width: 850px) {
  .ssf-form-copy .col-inner { position: sticky; top: 120px; }
}