/*
 * The <style> blocks WordPress printed at the end of <head> (and one in
 * <body>), collected here in document order.
 *
 * Every selector is naturally scoped to the page type that used it —
 * `.mesmerize-front-page` / `.header-homepage` only exist on the front page,
 * `.header` and `#pl-15` only on inner pages — so serving them together is
 * equivalent to WordPress printing them per template.
 */

/* --- Front page: first content section overlaps the hero (theme header). --- */
@media screen and (min-width: 768px) {
  .mesmerize-front-page.overlap-first-section:not(.mesmerize-front-page-with-slider)
    .header-homepage {
    padding-bottom: 95px;
  }

  .mesmerize-front-page.overlap-first-section:not(.mesmerize-front-page-with-slider)
    .page-content
    div[data-overlap]:first-of-type
    > div:not([class*='section-separator']) {
    margin-top: -95px;
  }
}

/* --- Front page: custom mobile background position. --- */
@media screen and (max-width: 767px) {
  /*Custom mobile position*/
  .header-homepage {
    background-position: 50% 0px;
  }
}

/* --- Inner pages: gradient overlay on the flat header. --- */
.header .background-overlay {
  background: linear-gradient(
    135deg,
    rgba(102, 126, 234, 0.8) 0%,
    rgba(118, 75, 162, 0.8) 100%
  );
}

/* --- Inner pages: "circles" header shape. --- */
.header.color-overlay:after {
  background: url(../images/header-shapes/circles.png) center center / cover no-repeat;
}

/* --- Recent Comments widget. --- */
.recentcomments a {
  display: inline !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* --- Page content background. --- */
.mesmerize-inner-page .page-content,
.mesmerize-inner-page .content,
.mesmerize-front-page.mesmerize-content-padding .page-content {
  background-color: #f5fafd;
}

/* --- Skip-link focus style (printed inside <body> on the original). --- */
.screen-reader-text[href='#page-content']:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  clip-path: none;
  color: #21759b;
}

/* --- "Get in touch": SiteOrigin Page Builder layout 15. --- */
/* Layout 15 */
#pgc-15-0-0,
#pgc-15-2-0 {
  width: 100%;
  width: calc(100% - (0 * 30px));
}
#pg-15-0,
#pg-15-1,
#pl-15 .so-panel {
  margin-bottom: 30px;
}
#pgc-15-1-0,
#pgc-15-1-1,
#pgc-15-1-2 {
  width: 33.3333%;
  width: calc(33.3333% - (0.666666666667 * 30px));
}
#pl-15 .so-panel:last-of-type {
  margin-bottom: 0px;
}
#pg-15-1.panel-has-style > .panel-row-style,
#pg-15-1.panel-no-style,
#pg-15-2.panel-has-style > .panel-row-style,
#pg-15-2.panel-no-style {
  -webkit-align-items: flex-start;
  align-items: flex-start;
}
#panel-15-1-0-0 > .panel-widget-style {
  padding: 5%;
}
#pg-15-2 > .panel-row-style {
  background-color: #37b0cd;
  padding: 5%;
}
@media (max-width: 780px) {
  #pg-15-0.panel-no-style,
  #pg-15-0.panel-has-style > .panel-row-style,
  #pg-15-0,
  #pg-15-1.panel-no-style,
  #pg-15-1.panel-has-style > .panel-row-style,
  #pg-15-1,
  #pg-15-2.panel-no-style,
  #pg-15-2.panel-has-style > .panel-row-style,
  #pg-15-2 {
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  #pg-15-0 > .panel-grid-cell,
  #pg-15-0 > .panel-row-style > .panel-grid-cell,
  #pg-15-1 > .panel-grid-cell,
  #pg-15-1 > .panel-row-style > .panel-grid-cell,
  #pg-15-2 > .panel-grid-cell,
  #pg-15-2 > .panel-row-style > .panel-grid-cell {
    width: 100%;
    margin-right: 0;
  }
  #pgc-15-1-0,
  #pgc-15-1-1 {
    margin-bottom: 30px;
  }
  #pl-15 .panel-grid-cell {
    padding: 0;
  }
  #pl-15 .panel-grid .panel-grid-cell-empty {
    display: none;
  }
  #pl-15 .panel-grid .panel-grid-cell-mobile-last {
    margin-bottom: 0px;
  }
}
