/*
 Theme Name:     Assembly
 Theme URI:      https://assembly.samcoombsdesign.com
 Description:    A Bold Child Theme for Divi.
 Author:         Sam Coombs Web Design
 Author URI:     https://samcoombsdesign.com
 Template:       Divi
 Version:        1.0.0
 License:    GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* =Theme customization starts here
------------------------------------------------------- */

/* BODY STYLES */

/* Prevent body from scrolling when js adds class .noscroll */
body.noscroll,
html.noscroll {
  overflow: hidden;
}

/* Prevent horizontal overflow - will break sticky elements */
/* .et-fb #et-boc,
#page-container {
  overflow-x: hidden;
} */

body {
  overflow-x: initial !important;
}

#page-container {
  overflow-y: initial !important;
}

/* Keep admin bar at top of screen */
@media screen and (max-width: 600px) {
  #wpadminbar {
    position: fixed !important;
  }
}

/* Set preload styles */
#construct-preload {
  background-color: var(--scwd_white_color);
  height: 100vh;
  width: 100vw;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 999999;
  overflow-x: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

#construct-preload p {
  font-size: 1.4rem;
}

/* Set images to cover if cover-img class is active */
.cover-img img {
  object-fit: cover;
}

/* NAV STYLES */

/* Align the default header */
.construct-nav-row .et_pb_column {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.construct-nav-row .construct-menu {
  flex-grow: 1;
}

/* Sets menu text colour */
.et-menu a,
.archive #et-boc .et-l .et-menu a {
  color: var(--scwd_dark_color);
}

/* Sets hamburger icon colour */
.construct-menu .et_mobile_menu li a,
.archive #et-boc .construct-menu.et_pb_menu .et_mobile_menu li a,
.construct-menu .mobile_menu_bar:before {
  color: var(--scwd_dark_color);
}

/* Change hamburger icon to "x" when mobile menu is open */
#et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before,
.et_pb_module.et_pb_menu
  .et_mobile_nav_menu
  .mobile_nav.opened
  .mobile_menu_bar::before {
  content: "\4d";
}

/* Reposition mobile nav */
.construct-menu .et_mobile_menu,
.et-db #et-boc .et-l .construct-menu .et_mobile_menu {
  width: 100vw;
  left: -5vw;
  border-top: 0;
  padding: 120px 5vw;
  overflow: scroll;
  height: 100vh;
  top: 0;
  z-index: -1;
  box-shadow: none;
}

/* Set background colour of mobile nav */
.et_pb_menu_0_tb_header.et_pb_menu.construct-menu .nav li ul:not(.sub-menu ul),
.et_pb_menu_0_tb_header.et_pb_menu.construct-menu .et_mobile_menu,
.et_pb_menu_0_tb_header.et_pb_menu .et_mobile_menu ul:not(.sub-menu ul) {
  background-color: var(--scwd_white_color) !important;
}

.construct-menu .et_mobile_menu .menu-item a {
  /* Add padding to nav link text*/
  padding: 20px;

  /* Style mobile nav link text */
  font-weight: bold;
  text-transform: uppercase;

  /* Set bottom border colour */
  border-color: var(--scwd_greyl_color);
}

/* Nav menu hover on mobile */
.construct-menu .et_mobile_menu .menu-item a:hover {
  background-color: var(--scwd_greyl_color);
}

/* Change BG of nav menu item that has children */
.construct-menu .et_mobile_menu .menu-item-has-children > a {
  background-color: var(--scwd_white_color);

  /* Allow ::after to add dropdown fuctionality */
  position: relative;
}

/* Remove left padding from sub-menu */
.construct-menu.et_pb_menu ul.sub-menu,
.et-db #et-boc .et-l .construct-menu.et_pb_menu ul.sub-menu {
  padding-left: 0;
}

/* Remove padding from sub-menu li */
.construct-menu.et_pb_menu ul.sub-menu li,
.et-db #et-boc .et-l .construct-menu.et_pb_menu ul.sub-menu li {
  padding-left: 0;
}

/* Set nav link text to initial styles and add BG and padding*/
.construct-menu.et_pb_menu ul.sub-menu li a,
.et-db #et-boc .et-l .construct-menu.et_pb_menu ul.sub-menu li a {
  text-transform: none;
  font-weight: initial;
  padding-left: 40px;
  background-color: var(--scwd_white_color);
}

/* Remove padding from DT Nav Links */
.construct-menu.et_pb_menu--with-logo .et_pb_menu__menu > nav > ul > li > a,
.et-db
  #et-boc
  .et-l
  .construct-menu.et_pb_menu--with-logo
  .et_pb_menu__menu
  > nav
  > ul
  > li
  > a {
  padding: 0;
}

/*  */
.construct-menu .et-menu .menu-item-has-children {
  padding-right: 22px;
}

.et-menu .menu-item-has-children > a:first-child:after {
  right: -15px;
}

/* Add underline to desktop Nav Links */
ul.et-menu > li > a:before {
  content: "";
  width: 0;
  left: -5%;
  bottom: 5px;
  height: 1px;
  background: var(--scwd_dark_color);
  position: absolute;
  z-index: -1;
  opacity: 0;
  transition: all 0.3s ease-in-out;
}

ul.et-menu > li > a:hover:before,
ul.et-menu > li.current-menu-item > a:before {
  width: 110%;
  opacity: 1;
}

ul.et-menu > li > a {
  z-index: 1;
}

/* Move DT sub-menu */
.et_pb_menu .et_pb_menu__menu > nav > ul > li > ul {
  left: auto;
  right: 0;
}

/* Remove top border from DT Nav sub-menu */
.construct-menu .nav li ul.sub-menu {
  border-top: none;
}

/* Style reverse dropdown sub-menu */
.construct-menu .nav li.et-reverse-direction-nav li ul {
  left: auto;
  right: 100%;
  top: -50%;
  box-shadow: none;
  background-color: var(--scwd_dark_color) !important;
}

.construct-menu .nav li.et-reverse-direction-nav li ul li a {
  background-color: transparent !important;
  color: var(--scwd_white_color);
}

/* Style normal dropdown sub-menu */
.construct-menu .nav ul.sub-menu li ul {
  background-color: var(--scwd_dark_color) !important;
  top: -50%;
  box-shadow: none;
}

.construct-menu .nav ul.sub-menu li ul li a {
  background-color: transparent !important;
  color: var(--scwd_white_color);
}

/* Rotate sub-menu arrow on DT */
.et-menu li li.menu-item-has-children > a:first-child:after {
  transform: rotate(-90deg);
  display: block !important;
}

.et-menu li li.menu-item-has-children {
  width: 100%;
}

/* Hide mobile CTA on DT & Tablet */
#et-boc .et_mobile_menu .construct-menu-cta-container {
  display: none;
}

/* Hide nav button on mobile */
@media screen and (max-width: 768px) {
  #et-boc .construct-menu-cta-container {
    display: none;
  }

  #et-boc .et_mobile_menu .construct-menu-cta-container {
    display: block;
    margin: 30px 0 !important;
  }
}

/* Create dropdown in mobile nav */

.construct-menu .et_mobile_menu .menu-item-has-children {
  position: relative;
}

.construct-menu .et_mobile_menu .menu-item-has-children .scwd-sub-menu-toggle {
  position: absolute;
  right: 0;
  height: 66px;
  width: 40px;
  padding: 20px;
  z-index: 1;
  background-color: transparent;
  border-bottom: none;
}

.construct-menu
  .et_mobile_menu
  .menu-item-has-children
  .scwd-sub-menu-toggle:hover {
  background-color: transparent;
}

.construct-menu
  .et_mobile_menu
  .menu-item-has-children
  .scwd-sub-menu-toggle::before {
  font-family: "ETmodules";
  content: "\33";
  font-size: 20px;
  color: var(--scwd_dark_color);
  position: absolute;
  height: 100%;
  width: 100%;
  right: 0;
  top: 0;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  transition: transform 0.3s ease;
}

.construct-menu
  .et_mobile_menu
  .menu-item-has-children
  .scwd-sub-menu-toggle.open::before {
  transform: rotateX(180deg);
}

.construct-menu .et_mobile_menu .scwd-sub-menu-toggle ~ ul.sub-menu,
.archive
  #et-boc
  .et_pb_menu.construct-menu
  .et_mobile_menu
  .scwd-sub-menu-toggle
  ~ ul.sub-menu {
  display: none !important;
  padding-left: 0;
}

.construct-menu .et_mobile_menu .scwd-sub-menu-toggle.open ~ ul.sub-menu,
.archive
  #et-boc
  .et_pb_menu.construct-menu
  .et_mobile_menu
  .scwd-sub-menu-toggle.open
  ~ ul.sub-menu {
  display: block !important;
}

/* SOCIAL MEDIA ICONS */
.construct-social-media-icons li,
.construct-social-media-icons li a.icon {
  height: 40px;
  width: 40px;
  margin-right: 15px;
}

.construct-social-media-icons li a.icon::before {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
}

.et-db #et-boc .et-l .construct-social-media-icons li a.icon {
  border-radius: 0;
  background-color: transparent !important;
  border: 1px solid var(--scwd_accent_color);
  transition: all 0.3s ease;
}

.et-db #et-boc .et-l .construct-social-media-icons li a.icon:hover {
  background-color: var(--scwd_accent_color) !important;
}

.construct-social-media-icons li a.icon::before {
  color: var(--scwd_white_color) !important;
}

.construct-social-media-icons li a.icon:hover::before {
  color: var(--scwd_dark_color) !important;
}

/* SCROLL TO TOP BUTTON */
.et_pb_scroll_top.et-pb-icon {
  border-radius: 0;
  background: var(--scwd_overlay_color);
  color: var(--scwd_white_color);
  box-shadow: 0px 0px 24px 0px rgb(26 26 26 / 33%);
  backdrop-filter: blur(15px);
}

/* FOOTER STYLES */

/* Remove extra bottom margin */
footer .et_pb_widget_area .et_pb_widget,
footer .et_pb_module.et_pb_widget_area .et_pb_widget ul,
footer .et_pb_column {
  margin-bottom: 0 !important;
}

/* Hide submenu list */
footer
  .et_pb_module.et_pb_widget_area
  .et_pb_widget
  ul
  .menu-item-has-children
  ul {
  display: none;
}

/* Match footer list items */
footer ul li {
  margin-bottom: 10px !important;
}

/* Match list text colour to normal text colour */
footer .construct-light-text .et_pb_module ul {
  color: var(--scwd_white_color);
  list-style: none;
  padding: 0;
}

@media screen and (max-width: 980px) {
  /* Re-add extra bottom margin */
  footer .et_pb_module.et_pb_widget_area .et_pb_widget ul:not(:last-of-type),
  footer .et_pb_column:not(:last-of-type) {
    margin-bottom: 30px !important;
  }

  footer .construct-footer-main {
    flex-direction: column;
  }

  footer .construct-footer-under {
    display: flex;
  }
}

/* TEXT STYLES */

/* Default heading and body colours */
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body p,
body a,
body.archive #et-boc .et-l h1,
body.archive #et-boc .et-l h2,
body.archive #et-boc .et-l h3,
body.archive #et-boc .et-l h4,
body.archive #et-boc .et-l h5,
body.archive #et-boc .et-l h6,
body.archive #et-boc .et-l p,
body.archive #et-boc .et-l a,
body.et-fb #et-boc .et-l h1,
body.et-fb #et-boc .et-l h2,
body.et-fb #et-boc .et-l h3,
body.et-fb #et-boc .et-l h4,
body.et-fb #et-boc .et-l h5,
body.et-fb #et-boc .et-l h6,
body.et-fb #et-boc .et-l p,
body.et-fb #et-boc .et-l a,
.entry-content thead th,
.entry-content tr th {
  color: var(--scwd_dark_color);
}

/* Light heading and body colours */
body .construct-light-text h1,
body .construct-light-text h2,
body .construct-light-text h3,
body .construct-light-text h4,
body .construct-light-text h5,
body .construct-light-text h6,
body .construct-light-text p,
body .construct-light-text a,
body.archive #et-boc .et-l .construct-light-text h2,
body.archive #et-boc .et-l .construct-light-text h3,
body.archive #et-boc .et-l .construct-light-text h1,
body.archive #et-boc .et-l .construct-light-text h4,
body.archive #et-boc .et-l .construct-light-text h5,
body.archive #et-boc .et-l .construct-light-text h6,
body.archive #et-boc .et-l .construct-light-text p,
body.archive #et-boc .et-l .construct-light-text a,
body.et-fb #et-boc .et-l .construct-light-text h1,
body.et-fb #et-boc .et-l .construct-light-text h2,
body.et-fb #et-boc .et-l .construct-light-text h3,
body.et-fb #et-boc .et-l .construct-light-text h4,
body.et-fb #et-boc .et-l .construct-light-text h5,
body.et-fb #et-boc .et-l .construct-light-text h6,
body.et-fb #et-boc .et-l .construct-light-text p,
body.et-fb #et-boc .et-l .construct-light-text a,
body.entry-content thead th,
.entry-content tr th {
  color: var(--scwd_white_color) !important;
}

/* BACKGROUND STYLES */

/* Dark BG */
.construct-dark-bg,
.et-fb #et-boc .et-l .construct-dark-bg,
.archive #et-boc .et-l .construct-dark-bg {
  background-color: var(--scwd_dark_color);
}

/* Light BG */
.construct-light-bg,
.et-fb #et-boc .et-l .construct-light-bg,
.archive #et-boc .et-l .construct-light-bg {
  background-color: var(--scwd_white_color);
}

/* Alt BG */
.construct-alt-bg,
.et-fb #et-boc .et-l .construct-alt-bg,
.archive #et-boc .et-l .construct-alt-bg {
  background-color: var(--scwd_greyl_color);
}

/* Accent BG */
.construct-accent-bg,
.et-fb #et-boc .et-l .construct-accent-bg,
.archive #et-boc .et-l .construct-accent-bg {
  background-color: var(--scwd_accent_color);
}

/* BG Image Overlay */

/* Image overlay for Parallax */
.bg-image-overlay span.et_parallax_gradient {
  background-color: var(--scwd_overlay_color);
}

/* Image overlay for normal images */
.bg-image-overlay:not(.et_pb_section_parallax)::before {
  content: "";
  background-color: var(--scwd_overlay_color) !important;
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

/* BUTTON STYLES */

/* Primary Button */
.et_pb_button_helper_class .et_pb_button.button-primary,
body.et_pb_button_helper_class.archive #et-boc .et-l .et_pb_button,
body.et-fb div#et-boc .et-l .et_pb_button.button-primary {
  background-color: var(--scwd_accent_color);
  border-color: var(--scwd_accent_color);
  color: var(--scwd_dark_color);
}

/* Primary Hover */
.et_pb_button_helper_class .et_pb_button.button-primary:hover,
body.et_pb_button_helper_class.archive #et-boc .et-l .et_pb_button,
body.et-fb div#et-boc .et-l .et_pb_button.button-primary:hover {
  background-color: transparent;
  border-color: var(--scwd_accent_color);
}

/* Primary Hover - Alternate text */
.et_pb_button_helper_class .et_pb_button.button-primary.alt-hover-text:hover,
body.et_pb_button_helper_class.archive #et-boc .et-l .et_pb_button,
body.et-fb div#et-boc .et-l .et_pb_button.button-primary.alt-hover-text:hover {
  color: var(--scwd_white_color);
}

/* Secondary Button */
.et_pb_button_helper_class .et_pb_button.button-secondary,
body.et_pb_button_helper_class.archive #et-boc .et-l .et_pb_button,
body.et-fb div#et-boc .et-l .et_pb_button.button-secondary {
  background-color: var(--scwd_dark_color);
  color: var(--scwd_white_color);
  border-color: transparent;
}

/* Secondary Hover */
.et_pb_button_helper_class .et_pb_button.button-secondary:hover,
body.et_pb_button_helper_class.archive #et-boc .et-l .et_pb_button,
body.et-fb div#et-boc .et-l .et_pb_button.button-secondary:hover {
  background-color: var(--scwd_dark_hover_color);
}

/* Tertiary Button */
.et_pb_button_helper_class .et_pb_button.button-tertiary,
body.et_pb_button_helper_class.archive #et-boc .et-l .et_pb_button,
body.et-fb div#et-boc .et-l .et_pb_button.button-tertiary {
  border-color: transparent;
  background-color: transparent;
  color: var(--scwd_white_color) !important;
}

/* Tertiary Hover */
.et_pb_button_helper_class .et_pb_button.button-tertiary:hover,
body.et_pb_button_helper_class.archive #et-boc .et-l .et_pb_button,
body.et-fb div#et-boc .et-l .et_pb_button.button-tertiary:hover {
  background-color: transparent;
  opacity: 0.8;
}

/* Tertiary Button - Dark */
.et_pb_button_helper_class .et_pb_button.button-tertiary.button-tertiary-dark,
body.et_pb_button_helper_class.archive #et-boc .et-l .et_pb_button,
body.et-fb div#et-boc .et-l .et_pb_button.button-tertiary.button-tertiary-dark {
  color: var(--scwd_dark_color) !important;
}

/* BLURB STYLES */

/* Make blurbs go to 2x2 grid  */
.et_pb_column.construct-icon-blurb-container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
}

/* Center content in its block */
.et_pb_column.construct-icon-blurb-container .construct-icon-blurb {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Central align icon to text */
.et_pb_column.construct-icon-blurb-container
  .construct-icon-blurb
  .et_pb_blurb_content {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10%;
}

/* Remove margin from icon */
.et_pb_column.construct-icon-blurb-container
  .construct-icon-blurb
  .et_pb_blurb_content
  .et_pb_main_blurb_image {
  margin: 0;
}

/* Set colour for blurb icon */
.et_pb_column.construct-icon-blurb-container
  .construct-icon-blurb
  .et_pb_blurb_content
  .et_pb_main_blurb_image
  .et-pb-icon {
  color: var(--scwd_accent_color);
}

/* Remove padding from header text */
.et_pb_column.construct-icon-blurb-container
  .construct-icon-blurb
  .et_pb_blurb_content
  .et_pb_module_header {
  padding-bottom: 0;
}

/* BLOG MODULE STYLES */

/* Page Navigation */
.wp-pagenavi {
  margin-top: 30px;
  margin-left: -1px;
}

.wp-pagenavi a,
.wp-pagenavi span {
  padding: 10px 15px;
  border: 1px solid var(--scwd_accent_color);
}

.wp-pagenavi span.current {
  color: var(--scwd_white_color);
  background-color: var(--scwd_dark_color);
}

/* Projects 2x1 Layout */
.et_pb_section
  .et_pb_row.construct-column-2
  .et_pb_column
  div
  div:first-of-type:not(.wp-pagenavi) {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 50px;
}

.et_pb_section
  .et_pb_row.construct-column-2
  .et_pb_column
  div
  div:first-of-type
  article.et_pb_post {
  margin-bottom: 0;
}

/* Set project featured image aspect ratio */
.et_pb_post .entry-featured-image-url {
  aspect-ratio: 3 / 2;
}

/* Set project featured image height */
.et_pb_post .entry-featured-image-url img {
  height: 100%;
  object-fit: cover;
}

/* Change 2x1 to 1x2 */
@media screen and (max-width: 768px) {
  .et_pb_section
    .et_pb_row.construct-column-2
    .et_pb_column
    div
    div:first-of-type,
  .et_pb_section
    .et_pb_row.construct-column-3
    .et_pb_column
    div
    div:first-of-type {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

/* TEAM SECTION STYLES */
.construct-team-grid .et_pb_column .et_pb_blurb_content .et_pb_main_blurb_image,
.construct-team-grid
  .et_pb_column
  .et_pb_blurb_content
  .et_pb_main_blurb_image
  span.et_pb_image_wrap,
.construct-team-grid
  .et_pb_column
  .et_pb_blurb_content
  .et_pb_main_blurb_image
  span.et_pb_image_wrap
  img {
  width: 100%;
}

.construct-team-grid
  .et_pb_column
  .et_pb_blurb_content
  .et_pb_blurb_container
  h4 {
  padding: 0;
}

@media screen and (max-width: 980px) {
  .construct-team-grid {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 100%;
    grid-template-rows: 1fr;
    overflow: scroll;
    scroll-snap-type: x mandatory;
    gap: 30px;
  }

  .construct-team-grid::-webkit-scrollbar {
    display: none;
  }

  .construct-team-grid .et_pb_column {
    width: 100% !important;
    scroll-snap-align: start;
  }
}

/* TEAM SECTION STYLES - Post List */

/* TESTIMONIAL SECTION STYLES  */
.construct-testimonial-section .et_pb_column .et_pb_with_border.et_pb_module {
  border-color: var(--scwd_dark_color);
}

.construct-testimonial-section
  .et_pb_column
  .et_pb_with_border.et_pb_module
  .et_pb_testimonial_author {
  color: var(--scwd_dark_color);
}

/* FAQ STYLES */

/* Set border color of faq blocks */
.construct-faq-accordion .et_pb_accordion_item {
  padding: 0;
  border-color: var(--scwd_dark_color);
  margin-bottom: 0 !important;
}

.construct-faq-accordion .et_pb_accordion_item:not(:last-of-type) {
  border-bottom: 0;
}

/* Re-add padding to heading */
.construct-faq-accordion .et_pb_accordion_item h4 {
  padding: 20px;
  transition: all 0.3s ease;
}

/* Background colour for open question heading */
.construct-faq-accordion .et_pb_accordion_item.et_pb_toggle_open h4 {
  background-color: var(--scwd_accent_color);
}

/* Background colour for closed question heading */
.construct-faq-accordion .et_pb_accordion_item.et_pb_toggle_close h4 {
  background-color: var(--scwd_white_color);
}

/* Set colour of open faq question */
.construct-faq-accordion.et_pb_accordion
  .et_pb_toggle_open
  .et_pb_toggle_title {
  color: var(--scwd_dark_color);
}

/* Set colour of closed faq question */
.construct-faq-accordion.et_pb_accordion
  .et_pb_toggle_close
  .et_pb_toggle_title {
  color: var(--scwd_dark_color);
  opacity: 0.8;
}

/* Move open / close icons */
.construct-faq-accordion.et_pb_accordion
  .et_pb_toggle_open
  .et_pb_toggle_title:before,
.construct-faq-accordion.et_pb_accordion
  .et_pb_toggle_close
  .et_pb_toggle_title:before {
  margin-right: 20px;
  color: var(--scwd_dark_color);
  font-size: 25px;
}

/* Change close icon */
.construct-faq-accordion.et_pb_accordion
  .et_pb_toggle_open
  .et_pb_toggle_title:before {
  display: block;
  content: "\4b";
}

/* Change open icon */
.construct-faq-accordion.et_pb_accordion
  .et_pb_toggle_close
  .et_pb_toggle_title:before {
  content: "\4c";
}

/* Set bg for answers */
.construct-faq-accordion .et_pb_accordion_item p {
  background-color: var(--scwd_white_color);
  padding: 20px;
}

/* CONTACT FORM STYLES */

/* Homepage Contact Form */

/* Set text color and background colour */
.et_pb_module.construct-hp-contact-form
  .et_pb_contact
  form
  .et_pb_contact_field
  input,
.et_pb_module.construct-hp-contact-form
  .et_pb_contact
  form
  .et_pb_contact_field
  textarea,
.et_pb_module.construct-hp-contact-form
  .et_pb_contact
  form
  .et_pb_contact_field
  select {
  background-color: var(--scwd_white_color);
  color: var(--scwd_dark_color);
}

/* Change placeholder text colour */
.et_pb_module.construct-hp-contact-form
  .et_pb_contact
  form
  .et_pb_contact_field
  input::placeholder,
.et_pb_module.construct-hp-contact-form
  .et_pb_contact
  form
  .et_pb_contact_field
  textarea::placeholder,
.et_pb_module.construct-hp-contact-form
  .et_pb_contact
  form
  .et_pb_contact_field
  select::placeholder {
  color: var(--scwd_dark_color);
}

/* Set dropdow arrow colour */
.et_pb_module.construct-hp-contact-form
  .et_pb_contact
  form
  .et_pb_contact_field[data-type="select"]:after {
  border-top-color: var(--scwd_dark_color);
}

/* Submit Button */

/* Positioning */
.et_pb_module.construct-hp-contact-form
  .et_pb_contact
  form
  .et_contact_bottom_container {
  float: left;
  margin-top: 0;
}

/* Button Styling */
.et_pb_module.construct-hp-contact-form
  .et_pb_contact
  form
  .et_contact_bottom_container
  button.et_pb_button {
  background-color: var(--scwd_accent_color);
  color: var(--scwd_dark_color);
  border-color: var(--scwd_accent_color);
  margin: 0px 0 0 16px;
}

/* Button Styling - Hover */
.et_pb_module.construct-hp-contact-form
  .et_pb_contact
  form
  .et_contact_bottom_container
  button.et_pb_button:hover {
  background-color: transparent;
  color: var(--scwd_white_color);
}

/* Submit thank you message */
.et_pb_module.construct-hp-contact-form .et-pb-contact-message p {
  border: 1px solid var(--scwd_accent_color);
  padding: 20px;
}

/* Contact Page Contact Form */
/* Button Styling */
.et_pb_module.construct-hp-contact-form.construct-hp-contact-form-2
  .et_pb_contact
  form
  .et_contact_bottom_container
  button.et_pb_button {
  background-color: var(--scwd_dark_color);
  color: var(--scwd_white_color);
  border-color: var(--scwd_dark_color);
  margin: 0px 0 0 16px;
}

/* Button Styling - Hover */
.et_pb_module.construct-hp-contact-form
  .et_pb_contact
  form
  .et_contact_bottom_container
  button.et_pb_button:hover {
  background-color: var(--scwd_dark_hover_color);
  color: var(--scwd_white_color);
}

/* Submit thank you message */
.et_pb_module.construct-hp-contact-form .et-pb-contact-message p {
  border: 1px solid var(--scwd_dark_hover_color);
  padding: 20px;
}

/* BLOG SECTION STYLES */

/* Set blog grid to 3 columns */
.construct-blog-grid .et_pb_blog_grid .et_pb_salvattore_content {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 50px;
}

/* Expand inner columns to be full width */
.construct-blog-grid .et_pb_blog_grid div div .column,
.construct-blog-grid .et_pb_blog_grid .column {
  width: 100% !important;
}

/* Remove bottom margin on blog post */
.construct-blog-grid .et_pb_blog_grid div div .column article,
.construct-blog-grid .et_pb_blog_grid .column article {
  margin-bottom: 0 !important;
  height: 100%;
}

.construct-blog-grid
  .et_pb_blog_grid
  div
  div
  .column
  article
  .post-content-inner
  p,
.construct-blog-grid .et_pb_blog_grid .column article .post-content-inner p {
  color: var(--scwd_dark_color);
}

@media screen and (max-width: 980px) {
  /* Set blog grid to 1 column on mobile */
  .construct-blog-grid .et_pb_blog_grid .et_pb_salvattore_content {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
  }

  /* Set height of posts on mobile */
  .construct-blog-grid .et_pb_blog_grid div div .column article {
    height: auto;
  }

  /* Remove bottom margin on blog post */
  .construct-blog-grid
    .et_pb_blog_grid
    div
    div
    .column
    article:not(:last-of-type) {
    margin-bottom: 50px !important;
  }
}

/* NUMBERS SECTION - About Page*/

.construct-number-counter .percent {
  margin-bottom: 0 !important;
}

@media screen and (max-width: 480px) {
  .construct-number-counter .et_pb_row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}

/* CLIENT LOGOS SECTION */

/* Single logo container */
.construct-client-logos .et_pb_image {
  border-radius: 1000px;
  height: auto;
  width: 100%;
  aspect-ratio: 1 / 1;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--scwd_white_color);
  position: relative;
}

/* Single logo background border */
.construct-client-logos .et_pb_image::after {
  content: "";
  border-radius: 1000px;
  height: 110%;
  width: 110%;
  border: 1px solid var(--scwd_accent_color);
  position: absolute;
  z-index: -1;
  transition: all 0.3s ease;
}

/* Change background on hover */
.construct-client-logos .et_pb_image:hover::after {
  border: 1px solid var(--scwd_accent_color);
  transform: scale(1.1);
  opacity: 0;
}

/* Shrink logo within circle */
.construct-client-logos .et_pb_image span.et_pb_image_wrap {
  width: 60%;
  height: auto;
}

@media screen and (max-width: 980px) {
  .construct-client-logos .et_pb_equal_columns {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
  }

  .construct-client-logos .et_pb_equal_columns div.et_pb_column {
    width: 100%;
    margin: 0 !important;
  }
}

/* PROJECT GALLERY */

/* Set gallery as a grid */
.construct-project-gallery .et_post_gallery {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 30px;
}

/* Adjust grid for mobile */
@media screen and (max-width: 980px) {
  .construct-project-gallery .et_post_gallery {
    grid-template-columns: 1fr 1fr;
  }
}

/* Set items to take up 100% of parent for equal sizing*/
.construct-project-gallery .et_post_gallery .et_pb_gallery_item,
.construct-project-gallery .et_post_gallery .et_pb_gallery_item img {
  width: 100%;
  height: 100%;
  display: flex;
  object-fit: cover;
}

/* Set first (and every 6th) element to be bigger than others */
.construct-project-gallery .et_post_gallery .et_pb_gallery_item:nth-of-type(1),
.construct-project-gallery
  .et_post_gallery
  .et_pb_gallery_item:nth-of-type(6n) {
  grid-column: 1 / 3;
  grid-row: 1/3;
  height: 100%;
}

/* Set overlay colour */
.construct-project-gallery
  .et_post_gallery
  .et_pb_gallery_item
  .et_pb_gallery_image
  .et_overlay {
  background-color: var(--scwd_overlay_color);
}

/* Set icon colour */
.construct-project-gallery
  .et_post_gallery
  .et_pb_gallery_item
  .et_pb_gallery_image
  .et_overlay:before {
  color: var(--scwd_white_color);
}

/* Edits to lighbox */
.mfp-title {
  display: none;
}

/* Shrink close button */
.mfp-iframe-holder .mfp-close,
.mfp-image-holder .mfp-close {
  font-size: 30px;
  top: 0;
  color: var(--scwd_white_color);
  transition: opacity 0.3s ease;
}

/* Increase opacity of buttons */
.mfp-arrow,
.mfp-arrow-right .mfp-a,
.mfp-arrow-left .mfp-a {
  opacity: 1 !important;
}

/* Move buttons so evenly space them from edge */
.mfp-container .mfp-arrow-right {
  right: 10px;
}
.mfp-container .mfp-arrow-left {
  left: 10px !important;
}

/* Set button styles */
.mfp-arrow-right:after,
.mfp-arrow-left:after {
  font-size: 40px;
  background-color: var(--scwd_white_color);
  border: 1px solid var(--scwd_white_color) !important;
  color: var(--scwd_dark_color);
  opacity: 1 !important;
  transition: all 0.3s ease;
}

/* Set hover variations of buttons */
.mfp-arrow-right:hover:after,
.mfp-arrow-left:hover:after {
  border: 1px solid var(--scwd_accent_color) !important;
  background-color: transparent !important;
  color: var(--scwd_white_color) !important;
}

/* Change border colour for pagination */
.construct-project-gallery .et_pb_gallery .et_pb_gallery_pagination {
  border-top: 1px solid var(--scwd_greyl_color);
}

/* Styles for pagination links */
.construct-project-gallery .et_pb_gallery .et_pb_gallery_pagination ul li {
  border: 1px solid var(--scwd_accent_color);
  padding: 5px 0 5px 0;
  transition: all 0.3s ease;
}

/* Hover for pagination links */
.construct-project-gallery
  .et_pb_gallery
  .et_pb_gallery_pagination
  ul
  li:hover {
  border: 1px solid var(--scwd_dark_color);
  background-color: var(--scwd_dark_color);
  color: var(--scwd_white_color);
}

/* Add spacing for pagination links */
.construct-project-gallery
  .et_pb_gallery
  .et_pb_gallery_pagination
  ul
  li:not(:first-of-type) {
  margin-left: 10px;
  margin-top: 10px;
}

/* Set colours and styles for pagination links */
.construct-project-gallery .et_pb_gallery .et_pb_gallery_pagination ul li a {
  color: var(--scwd_dark_color);
  padding: 10px 15px;
  transition: all 0.3s ease;
}

/* Hover for pagination links */
.construct-project-gallery
  .et_pb_gallery
  .et_pb_gallery_pagination
  ul
  li:hover
  a {
  color: var(--scwd_white_color);
}

/* SERVICE */
/* Set image on single service page to be square */
.construct-service-img img {
  aspect-ratio: 1 / 1;
}

/* Service Section Grid */
.construct-services-section .et_pb_main_blurb_image {
  color: var(--scwd_dark_color);
}

/* BLOG */

/* Add line to sidebar header */
.blog-sidebar-header p:after {
  content: "";
  width: 50%;
  height: 1px;
  background-color: var(--scwd_dark_color);
}

@media screen and (max-width: 1213px) {
  .blog-sidebar-header p:after {
    width: 35%;
  }
}

@media screen and (max-width: 980px) {
  .blog-sidebar-header p:after {
    width: 75%;
  }
}

@media screen and (max-width: 440px) {
  .blog-sidebar-header p:after {
    width: 60%;
  }
}

/* Align sidebar header */
.blog-sidebar-header p {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Removes additional spacing between sidebar posts */
.blog-post-sidebar-posts article {
  margin: 0;
  padding: 25px 0;
}

/* Remove additional spacing on post meta */
.blog-post-sidebar-posts article .post-meta {
  margin: 0;
}

/* Remove top padding on top post */
.blog-post-sidebar-posts article:first-of-type {
  padding-top: 0;
}

/* Add border between posts */
.blog-post-sidebar-posts article:not(:first-of-type) {
  border-top: 1px solid var(--scwd_greyl_color);
}

/* Post title */
.et_pb_title_container {
  margin-top: 30px;
}

/* On post pagination */
.et_pb_posts_nav.nav-single .nav-next,
.et_pb_posts_nav.nav-single .nav-previous {
  border: 1px solid var(--scwd_accent_color);
  padding: 5px;
  transition: all 0.3s ease;
}

/* On post pagination hover */
.et_pb_posts_nav.nav-single .nav-next:hover,
.et_pb_posts_nav.nav-single .nav-previous:hover {
  border: 1px solid var(--scwd_dark_color);
  background-color: var(--scwd_dark_color);
}

/* Pagination link */
.et_pb_posts_nav.nav-single .nav-next a,
.et_pb_posts_nav.nav-single .nav-previous a {
  color: var(--scwd_dark_color);
  transition: all 0.3s ease;
}

/* Pagination link hover */
.et_pb_posts_nav.nav-single .nav-next:hover a,
.et_pb_posts_nav.nav-single .nav-previous:hover a {
  color: var(--scwd_white_color);
}

/* CONTACT PAGE */
/* Set colour for icons on contact page */
.contact-blurb {
  color: var(--scwd_accent_color);
}

/* Remove additional spacing from */
.contact-blurb .et_pb_blurb_content {
  margin-left: 0;
}

/* Team Blog Grid */
.team-blog-grid .et_pb_image_container {
  aspect-ratio: 4 / 5;
  height: auto;
  width: 100%;
}

.team-blog-grid .et_pb_image_container a {
  height: 100%;
  width: 100%;
}

.team-blog-grid .entry-featured-image-url {
  aspect-ratio: 4 / 5;
}

.team-blog-grid img {
  object-fit: cover;
  height: auto;
  width: 100%;
}

.team-blog-grid .column {
  margin-right: 0 !important;
  width: 100% !important;
}

/* .team-blog-grid .et_pb_salvattore_content {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3rem;
} */

.team-blog-grid > div {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3rem;
}

@media (max-width: 768px) {
  .team-blog-grid > div {
    grid-template-columns: 1fr;
  }
}

.team-blog-grid .et_pb_blog_grid .et_pb_post {
  padding: 0 !important;
}

.team-blog-grid .et_pb_image_container {
  margin: 0px 0px 30px;
}

/* Single Team Content */
.single-team-content .team-member-content-module {
  display: grid;
  grid-template-columns: 3fr 5fr;
  grid-template-rows: 1fr;
  gap: 0;
}

.single-team-content .et_pb_team_member_image {
  width: 100%;
  max-width: 100%;
  height: 100%;
}

.single-team-content .et_pb_team_member_description {
  padding: 7% 5rem;
}

.single-team-content .et_pb_team_member_image img {
  height: 100%;
  object-fit: cover;
}

@media (max-width: 980px) {
  .single-team-content .team-member-content-module {
    grid-template-columns: 1fr;
  }

  .single-team-content .et_pb_team_member_description {
    padding: 5% 0;
  }
}

/* Splide */
.splide__arrow--prev {
  left: -1em;
}

.splide__arrow--next {
  right: -1em;
}

.splide__pagination {
  bottom: -4rem;
  padding: 0 !important;
}

.splide__pagination button.splide__pagination__page {
  background: #f4f4f42d !important;
  border: 1px solid var(--scwd_dark_hover_color) !important;
}

.splide__pagination button.splide__pagination__page.is-active {
  background: #f4f4f4 !important;
}
