/* songa-custom.css — site custom styles (moved from WP Additional CSS 2026-07-30)
 * Enqueued by DiviChildTheme/functions.php. Edit here, not in Appearance → Customize → Additional CSS.
 */
/* About Stephanie — full-width portrait
 * Safari bug: parent transform (even 1°) + overflow:hidden frays the portrait edges.
 * Divi also emits width: 200px !important from portrait_width — beat it with higher specificity.
 */
.et_pb_module.et_pb_testimonial.songa-about-stephanie {
  overflow: visible !important;
  transform: none !important;
}
.et_pb_module.et_pb_testimonial.songa-about-stephanie .et_pb_testimonial_portrait {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding-bottom: 0 !important;
  margin: 0 0 1.25em 0 !important;
  float: none !important;
  aspect-ratio: 1024 / 731; /* match the uploaded image */
  background-size: cover !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
  border-radius: 0 !important;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* Fix checkmark font for Gravity Forms */
.el_gravity_forms_styler_0 .el_gravity_forms_styler_wrapper form input[type="checkbox"]:checked::before {
    font-family: ETModules !important;
    content: "N";
}
.gform-theme--framework input[type=checkbox]:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *))::before {color: #2a7cc0 !important;}


/* Fix indenting on bulleted listed */
.entry-content ol, .entry-content ul {
    padding: 20px 0px 20px 30px;
    list-style-position: outside;
}

.entry-content ol li, .entry-content ul li {
    margin-bottom: 10px;
}

h4.success {padding-left: 85px;	background-position: left center; background-image: url(/wp-content/uploads/2024/05/wired-gradient-267-like-thumb-up.png); background-repeat:no-repeat; background-size: 80px auto;font-size:1.5em;}

/* Change color of bullet markers */
ol li::marker, ul li::marker {
  color: #2b6195;
  font-weight: 700;
}

/* Remove odd margin below WP Map */
.wpgmp_map_parent {margin-bottom:0 !important;}

/* Remove underlines from slider nav arrows */
.et-pb-arrow-next, .et-pb-arrow-prev, .et-pb-arrow-next:hover, .et-pb-arrow-prev:hover {
    text-decoration: none!important;
  color:#2a7cc0 !important;
  font-size: 70px !important;
  margin-top: -35px !important;
}

/* Larger slider dot controllers */
.et_pb_slider .et-pb-controllers a {
    height: 15px !important;
    width: 15px !important;
}

/* Sitewide BG */
body.et_cover_background {
      background-image: linear-gradient(45deg,  rgba(42,124,192,.8) 0%,rgba(148,191,71,.8) 100%, transparent 60%), url(https://www.songaccounting.ca/wp-content/uploads/2023/12/songacc-bg-01.png) !important;
  background-size: cover, 2448px 3600px !important;
  /* background-size: 204px 118px !important;
  background-repeat:repeat !important;*/
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#2a7cc0+0,94bf47+100 */
/* background: linear-gradient(45deg,  #2a7cc0 0%,#94bf47 100%) !important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}

/* Add specific font-weight to headings */
h1, h2, h3, h4 {font-weight:600 !important;}


/*** Responsive Styles Large Desktop And Above ***/
@media all and (min-width: 1405px) {
  
}
 
/*** Responsive Styles Standard Desktop Only ***/
@media all and (min-width: 1100px) and (max-width: 1405px) {

}
 
/*** When to Hide Client Login Button ***/
@media all and (max-width: 995px) {

}

@media (min-width: 980px) {

  #menu-songacc-main-menu .menu_cta a::after {
    font-family: ETmodules!important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    -webkit-font-feature-settings: normal;
    font-feature-settings: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-shadow: 0 0;
    direction: ltr;

}

#menu-songacc-main-menu .menu_cta a::after, .menu_cta a::before {
    font-size: 32px;
    line-height: 1em;
    content: "\35";
    opacity: 0 !important;
    position: absolute;
    margin-left: -1em;
    -webkit-transition: all .2s;
    transition: all .2s;
    text-transform: none;
    -webkit-font-feature-settings: "kern" off;
    font-feature-settings: "kern" off;
    font-variant: none;
    font-style: normal;
    font-weight: 400;
    text-shadow: none;
}

#menu-songacc-main-menu .menu_cta a::after {
    content: '$';
    font-size: 14px;
}

#menu-songacc-main-menu .et_button_custom_icon .menu_cta a::after {
    line-height: 1.7em;
}

#menu-songacc-main-menu .menu_cta a::after, .menu_cta a::before {
    font-size: 32px;
    line-height: 1em;
    content: "\e06e";
    opacity: 0 !important;
    position: absolute;
    margin-left: -1em;
    -webkit-transition: all .2s;
    transition: all .2s;
    text-transform: none;
    -webkit-font-feature-settings: "kern" off;
    font-feature-settings: "kern" off;
    font-variant: none;
    font-style: normal;
    font-weight: 400;
    text-shadow: none;
}

#menu-songacc-main-menu .menu_cta.dhi-calendar-icon a::after, .menu_cta.dhi-calendar-icon a::before {content: '\e025' !important;}

#menu-songacc-main-menu .menu_cta a::before {
    display: none;
}

#menu-songacc-main-menu .menu_cta a {
    font-size: 20px;
    /* font-weight: 500; */
    padding: 0.3em 1em;
    /* line-height: 1.7em!important; */
    background-color: transparent;
    /* background-size: cover; */
    /* background-position: 50%; */
    /* background-repeat: no-repeat; */
    border: 2px solid;
    border-radius: 3px;
    -webkit-transition-duration: .2s;
    transition-duration: .2s;
    -webkit-transition-property: all!important;
    transition-property: all!important;
  }

#menu-songacc-main-menu .menu_cta a {
    font-size: 14px;
    background-color: #2a7cc0;
    border-width: 0px!important;
    border-radius: 50px;
    color: #ffffff;
}

    #menu-songacc-main-menu .menu_cta {
        padding: 0!important;
        border-radius: 50px;
        border: none;
        transition: 0.3s;
    }

    #menu-songacc-main-menu .menu_cta a{
        height: 2.5em;
        color: #ffffff!important;
        padding: 8px 1em!important;
        background-color: #2a7cc0;
        border-radius: 50px;
        top: 26%;
        left: 10%;
    }

    /* Divi call to action button hover state  */
    #menu-songacc-main-menu .menu_cta a:hover {
        opacity: 1 !important;
        background-color: #256da9 !important;
    }

    #menu-songacc-main-menu .menu_cta a::after {
        line-height: inherit;
        font-size: inherit!important;
        margin-left: -1em;
        left: auto;
        font-family: ETmodules!important;
        font-weight: 400!important;


        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        opacity: 0 !important;
        background: #256da9 !important;
        margin: 0 !important;
        height: 100% !important;
        font-size: 2em !important;
    }

    #menu-songacc-main-menu .menu_cta a[data-icon]:not([data-icon=""])::after {
        content: attr(data-icon);
    }

    #menu-songacc-main-menu .menu_cta a:hover::after {
      opacity: 1!important;
        bottom: 0 !important;
    }

    #menu-songacc-main-menu .menu_cta a{
        overflow: hidden;
    }

}

/*adjust Divi Menu module breakpoint*/
@media only screen and (max-width: 1185px) {

  .et_pb_menu .et_mobile_menu { top: 102px !important;border-top: none; }
  .et_pb_slider .et_pb_slide {background-position:80% !important;}

    .et_pb_menu .et_mobile_menu, .et_pb_menu .et_mobile_menu ul {
        list-style: none !important;
        text-align: left;
    }

    .et_pb_menu .et_pb_menu__menu {
        display: none;
    }
    .et_mobile_nav_menu {
        display: block;
    }
}


/*** Responsive Styles Tablet And Below ***/
@media all and (max-width: 980px) {


}
 
/*** Responsive Styles Tablet Only ***/
@media all and (min-width: 768px) and (max-width: 980px) {
    
   /* Hide descriptive text on slider from phones */
  /* .et_pb_fullwidth_slider_0.et_pb_slider .et_pb_slide_description {display:none !important;} */
}
 
/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
 
}
 
/*** Responsive Styles Smartphone Portrait ***/
@media all and (max-width: 479px) {
 
}
/* Site buttons — header .menu_cta sizing; #2a7cc0 at rest, #256da9 on hover.
   line-height = height centers the label optically (flex alone left text high). */
.entry-content a.et_pb_button,
.entry-content a.et_pb_button:visited,
.entry-content a.et_pb_button:hover,
.entry-content a.et_pb_button:focus {
    text-decoration: none !important;
    display: inline-block !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 35px !important;
    height: 35px !important;
    padding: 0 1em !important;
    border-radius: 50px !important;
    border-width: 0 !important;
    background-color: #2a7cc0 !important;
    background-image: none !important;
    color: #ffffff !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
    vertical-align: middle !important;
}
.entry-content a.et_pb_button:hover,
.entry-content a.et_pb_button:focus {
    background-color: #256da9 !important;
    background-image: none !important;
}
.entry-content a.et_pb_button::before,
.entry-content a.et_pb_button::after,
.entry-content a.et_pb_button:hover::before,
.entry-content a.et_pb_button:hover::after,
.entry-content a.et_pb_button:focus::before,
.entry-content a.et_pb_button:focus::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    position: static !important;
}

/* Contact section - photo floats right beside top of form; Name/Email side
   by side; Services Needed clears below in 2 columns. GF grid disabled for
   this form because a grid box cannot wrap around a float (see dev notes). */
#contact-stephanie-song-cpa-inc .contact-form-photo {
    float: right;
    width: 42%;
    max-width: 420px;
    margin: 0 0 24px 30px;
}
#gform_fields_4 {
    display: block;
}
#gform_fields_4 > .gfield {
    display: flow-root;      /* each row narrows beside the float instead of overlapping it */
    margin-bottom: 40px;     /* replaces the grid row-gap */
}
#gform_fields_4 > .gfield:last-child {
    margin-bottom: 0;
}
/* Name + Email side by side inside the wrap area. Float widths resolve against
   the full container: 42% + 30px + (29% - 28px) + 16px + (29% - 28px) = 100% - 10px */
#field_4_4,
#field_4_2 {
    float: left;
    width: calc(29% - 28px);
}
#field_4_4 {
    margin-right: 16px;
}
/* Message must be narrower than the remaining space beside the photo, or the
   textarea (replaced element) drops fully below the float at mid widths. */
#field_4_3 {
    clear: left;
    float: left;
    width: calc(58% - 30px);
    max-width: calc(100% - 450px); /* photo max 420px + 30px gutter */
    box-sizing: border-box;
}
#field_4_3 .ginput_container,
#field_4_3 textarea {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}
#field_4_5 {
    clear: both; /* Services Needed always starts on a fresh line below the photo */
}
#input_4_5 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 24px;          /* keeps GF's 12px vertical rhythm between choices */
}
/* Insurance: keep the AJAX validation summary box from sliding under the photo */
#gform_wrapper_4 .gform_validation_errors {
    display: flow-root;
}

@media (max-width: 980px) {
    #contact-stephanie-song-cpa-inc .contact-form-photo { width: 45%; max-width: 340px; }
    #field_4_4, #field_4_2 { width: calc(27.5% - 28px); }
    #field_4_3 { width: calc(55% - 30px); max-width: calc(100% - 370px); }
}
@media (max-width: 767px) {
    #contact-stephanie-song-cpa-inc .contact-form-photo {
        display: none;
    }
    #field_4_4, #field_4_2, #field_4_3 { float: none; width: 100%; max-width: none; }
    #field_4_4 { margin-right: 0; }
    #input_4_5 { grid-template-columns: 1fr; }
}