.elementor-5291 .elementor-element.elementor-element-undefined-53d6206{--display:flex;--min-height:320px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--border-radius:0px 0px 0px 0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5291 .elementor-element.elementor-element-undefined-e6cd229{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-5291 .elementor-element.elementor-element-undefined-e6cd229:not(.elementor-motion-effects-element-type-background), .elementor-5291 .elementor-element.elementor-element-undefined-e6cd229 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F3F5F8;background-image:url("https://pixelbypurpose.com/wp-content/uploads/2026/09/left-side.webp");background-size:cover;}.elementor-5291 .elementor-element.elementor-element-undefined-e6cd229.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-5291 .elementor-element.elementor-element-undefined-420deb5{margin:12px 12px calc(var(--kit-widget-spacing, 0px) + 12px) 12px;text-align:center;}.elementor-5291 .elementor-element.elementor-element-undefined-420deb5 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:24px;font-weight:700;font-style:normal;text-decoration:none;line-height:130%;color:#FFFFFF;}.elementor-5291 .elementor-element.elementor-element-783bda7{margin:0px 10px calc(var(--kit-widget-spacing, 0px) + 0px) 10px;text-align:center;}.elementor-5291 .elementor-element.elementor-element-783bda7 .elementor-heading-title{font-size:14px;font-weight:400;line-height:20px;}.elementor-5291 .elementor-element.elementor-element-undefined-93930e8{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:space-evenly;--align-items:center;--gap:1% 1%;--row-gap:1%;--column-gap:1%;--margin-top:22px;--margin-bottom:22px;--margin-left:22px;--margin-right:22px;--padding-top:0%;--padding-bottom:0%;--padding-left:4%;--padding-right:4%;}.elementor-5291 .elementor-element.elementor-element-0c5fc59.elementor-element{--align-self:flex-start;}.elementor-5291 .elementor-element.elementor-element-0c5fc59{text-align:start;}.elementor-5291 .elementor-element.elementor-element-0c5fc59 .elementor-heading-title{font-size:22px;font-weight:700;color:#000000;}.elementor-5291 .elementor-element.elementor-element-70fe20d{width:100%;max-width:100%;margin:20px 0px calc(var(--kit-widget-spacing, 0px) + 20px) 0px;}#elementor-popup-modal-5291{background-color:rgba(0,0,0,.8);justify-content:center;align-items:center;pointer-events:all;}#elementor-popup-modal-5291 .dialog-message{width:1000px;height:auto;}#elementor-popup-modal-5291 .dialog-close-button{display:flex;}#elementor-popup-modal-5291 .dialog-widget-content{box-shadow:2px 8px 23px 3px rgba(0,0,0,0.2);}@media(max-width:1024px){.elementor-5291 .elementor-element.elementor-element-undefined-53d6206{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-5291 .elementor-element.elementor-element-undefined-e6cd229{--min-height:145px;}.elementor-5291 .elementor-element.elementor-element-undefined-420deb5 .elementor-heading-title{font-size:40px;}.elementor-5291 .elementor-element.elementor-element-undefined-93930e8{--min-height:160px;--padding-top:0%;--padding-bottom:0%;--padding-left:1%;--padding-right:1%;}}@media(max-width:767px){.elementor-5291 .elementor-element.elementor-element-undefined-e6cd229{--min-height:175px;--padding-top:0%;--padding-bottom:0%;--padding-left:6%;--padding-right:6%;}.elementor-5291 .elementor-element.elementor-element-undefined-420deb5 .elementor-heading-title{font-size:32px;line-height:120%;}.elementor-5291 .elementor-element.elementor-element-undefined-93930e8{--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:space-around;--align-items:center;--gap:25px 25px;--row-gap:25px;--column-gap:25px;--margin-top:0px;--margin-bottom:0px;--margin-left:16px;--margin-right:0px;--padding-top:10%;--padding-bottom:10%;--padding-left:0%;--padding-right:0%;}.elementor-5291 .elementor-element.elementor-element-undefined-93930e8.e-con{--align-self:center;}.elementor-5291 .elementor-element.elementor-element-0c5fc59{margin:0px 6px calc(var(--kit-widget-spacing, 0px) + 0px) 11px;padding:0px 0px 0px 0px;}.elementor-5291 .elementor-element.elementor-element-70fe20d{width:var( --container-widget-width, 316px );max-width:316px;--container-widget-width:316px;--container-widget-flex-grow:0;}}@media(min-width:768px){.elementor-5291 .elementor-element.elementor-element-undefined-53d6206{--width:100%;}.elementor-5291 .elementor-element.elementor-element-undefined-e6cd229{--width:44.9%;}.elementor-5291 .elementor-element.elementor-element-undefined-93930e8{--width:58%;}}@media(max-width:1024px) and (min-width:768px){.elementor-5291 .elementor-element.elementor-element-undefined-e6cd229{--width:100%;}.elementor-5291 .elementor-element.elementor-element-undefined-93930e8{--width:100%;}}/* Start custom CSS for shortcode, class: .elementor-element-70fe20d *//* =========================================================
   PIXELBYPURPOSE POPUP CONTACT FORM
   Elementor Shortcode Widget > Advanced > Custom CSS
   CSS Class applied to widget: pixel-contact-form
   ========================================================= */


/* =========================================================
   FORM RESET
   ========================================================= */

.pixel-contact-form .wpcf7 {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.pixel-contact-form form.wpcf7-form {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    display: block !important;

    box-sizing: border-box !important;
}


/* =========================================================
   RESET CF7 PARAGRAPHS
   ========================================================= */

.pixel-contact-form form.wpcf7-form > p {
    width: 100% !important;

    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    height: auto !important;
    min-height: 0 !important;

    box-sizing: border-box !important;
}


/* =========================================================
   FIELD SPACING
   ========================================================= */

/*
   Space between each field block (label + input)
   and the next field's label.
*/

.pixel-contact-form form.wpcf7-form > p:has(input[type="text"]),
.pixel-contact-form form.wpcf7-form > p:has(input[type="email"]),
.pixel-contact-form form.wpcf7-form > p:has(input[type="tel"]),
.pixel-contact-form form.wpcf7-form > p:has(select),
.pixel-contact-form form.wpcf7-form > p:has(textarea) {

    margin-bottom: 30px !important;
}


/* =========================================================
   REMOVE EXTRA SPACE BEFORE FIRST FIELD
   ========================================================= */

.pixel-contact-form form.wpcf7-form > p:has(input[type="text"]):first-child,
.pixel-contact-form form.wpcf7-form > p:has(input[type="email"]):first-child,
.pixel-contact-form form.wpcf7-form > p:has(input[type="tel"]):first-child {

    margin-top: 0 !important;
}


/* =========================================================
   LABEL
   ========================================================= */

.pixel-contact-form form.wpcf7-form label {

    display: block !important;

    width: 100% !important;

    margin: 0 0 6px 0 !important;
    padding: 0 !important;

    color: #111111 !important;

    font-family: inherit !important;

    font-size: 15px !important;
    line-height: 1.3 !important;

    font-weight: 500 !important;

    text-align: left !important;

    box-sizing: border-box !important;
}


/* =========================================================
   TEXT / EMAIL / PHONE INPUTS
   ========================================================= */

.pixel-contact-form form.wpcf7-form input[type="text"],
.pixel-contact-form form.wpcf7-form input[type="email"],
.pixel-contact-form form.wpcf7-form input[type="tel"],
.pixel-contact-form form.wpcf7-form input[type="number"] {

    display: block !important;

    width: 100% !important;

    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;

    margin: 2px 0 0 0 !important;

    padding: 3px 0 7px 0 !important;

    background: transparent !important;
    background-color: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid #b8bcc4 !important;

    border-radius: 0 !important;

    outline: none !important;
    box-shadow: none !important;

    color: #111111 !important;

    font-family: inherit !important;

    font-size: 15px !important;
    line-height: 1.3 !important;

    font-weight: 400 !important;

    box-sizing: border-box !important;
}


/* =========================================================
   BUDGET SELECT
   ========================================================= */

.pixel-contact-form form.wpcf7-form select {

    display: block !important;

    width: 100% !important;

    height: 36px !important;
    min-height: 36px !important;

    margin: 2px 0 0 0 !important;

    padding: 3px 22px 7px 0 !important;

    background: transparent !important;
    background-color: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid #b8bcc4 !important;

    border-radius: 0 !important;

    outline: none !important;
    box-shadow: none !important;

    color: #111111 !important;

    font-family: inherit !important;

    font-size: 15px !important;
    line-height: 1.3 !important;

    box-sizing: border-box !important;
}


/* =========================================================
   MESSAGE TEXTAREA
   ========================================================= */

.pixel-contact-form form.wpcf7-form textarea {

    display: block !important;

    width: 100% !important;

    height: 82px !important;
    min-height: 82px !important;
    max-height: 82px !important;

    margin: 2px 0 0 0 !important;

    padding: 3px 0 8px 0 !important;

    background: transparent !important;
    background-color: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid #b8bcc4 !important;

    border-radius: 0 !important;

    outline: none !important;
    box-shadow: none !important;

    color: #111111 !important;

    font-family: inherit !important;

    font-size: 15px !important;
    line-height: 1.35 !important;

    resize: none !important;

    box-sizing: border-box !important;
}


/* =========================================================
   PLACEHOLDERS
   ========================================================= */

.pixel-contact-form form.wpcf7-form input::placeholder,
.pixel-contact-form form.wpcf7-form textarea::placeholder {

    color: #c1c3c8 !important;

    opacity: 1 !important;

    font-family: inherit !important;

    font-size: 15px !important;

    font-weight: 400 !important;
}


/* =========================================================
   FOCUS
   ========================================================= */

.pixel-contact-form form.wpcf7-form input[type="text"]:focus,
.pixel-contact-form form.wpcf7-form input[type="email"]:focus,
.pixel-contact-form form.wpcf7-form input[type="tel"]:focus,
.pixel-contact-form form.wpcf7-form input[type="number"]:focus,
.pixel-contact-form form.wpcf7-form select:focus,
.pixel-contact-form form.wpcf7-form textarea:focus {

    outline: none !important;

    border-top: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;

    border-bottom: 1px solid #858991 !important;

    box-shadow: none !important;
}


/* =========================================================
   BUTTON
   ========================================================= */

/* Space above the button, matching the field rhythm */

.pixel-contact-form form.wpcf7-form > p:has(input[type="submit"]) {

    margin-top: 40px !important;
    margin-bottom: 0 !important;

    padding: 0 !important;
}


/* Actual button */

.pixel-contact-form form.wpcf7-form input[type="submit"] {

    display: inline-block !important;

    width: auto !important;
    max-width: max-content !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;

    padding: 11px 20px !important;

    background: #FFE950 !important;
    background-color: #FFE950 !important;

    color: #111111 !important;

    border: 0 !important;
    border-radius: 8px !important;

    font-family: inherit !important;

    font-size: 14px !important;
    line-height: 1.2 !important;

    font-weight: 500 !important;

    white-space: nowrap !important;

    box-shadow: none !important;

    cursor: pointer !important;

    box-sizing: border-box !important;

    transition: background-color 0.2s ease,
                transform 0.2s ease,
                box-shadow 0.2s ease !important;
}


/* =========================================================
   BUTTON HOVER
   ========================================================= */

.pixel-contact-form form.wpcf7-form input[type="submit"]:hover {

    background: #F5DC2E !important;
    background-color: #F5DC2E !important;
    color: #111111 !important;

    transform: translateY(-1px) !important;

    box-shadow: 0 5px 14px rgba(0,0,0,0.08) !important;
}


/* =========================================================
   TURNSTILE
   ========================================================= */

.pixel-contact-form .wpcf7-turnstile,
.pixel-contact-form .cf-turnstile {

    width: 100% !important;

    margin: 0 0 12px 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;
}


/* =========================================================
   VALIDATION
   ========================================================= */

.pixel-contact-form .wpcf7-not-valid-tip {

    display: block !important;

    margin: 4px 0 0 0 !important;

    color: #b42318 !important;

    font-size: 11px !important;
    line-height: 1.3 !important;

    font-weight: 400 !important;
}


/* =========================================================
   CF7 RESPONSE MESSAGE
   Hidden until CF7 has an actual response
   ========================================================= */

.pixel-contact-form .wpcf7-response-output {

    display: none !important;

    width: 100% !important;

    margin: 10px 0 0 0 !important;
    padding: 9px 10px !important;

    background: #f7f7f7 !important;

    border: 1px solid #d0d3d8 !important;
    border-radius: 6px !important;

    color: #111111 !important;

    font-family: inherit !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    font-weight: 400 !important;

    text-align: left !important;

    box-sizing: border-box !important;
}


/* =========================================================
   SHOW RESPONSE AFTER SUBMISSION
   ========================================================= */

.pixel-contact-form form.sent .wpcf7-response-output,
.pixel-contact-form form.invalid .wpcf7-response-output,
.pixel-contact-form form.failed .wpcf7-response-output,
.pixel-contact-form form.aborted .wpcf7-response-output,
.pixel-contact-form form.spam .wpcf7-response-output,
.pixel-contact-form form.unaccepted .wpcf7-response-output {

    display: block !important;
}


/* =========================================================
   SUCCESS RESPONSE
   ========================================================= */

.pixel-contact-form form.sent .wpcf7-response-output {

    color: #176b2c !important;

    background: #eef9f0 !important;

    border-color: #8bc995 !important;
}


/* =========================================================
   ERROR RESPONSE
   ========================================================= */

.pixel-contact-form form.invalid .wpcf7-response-output,
.pixel-contact-form form.failed .wpcf7-response-output,
.pixel-contact-form form.aborted .wpcf7-response-output,
.pixel-contact-form form.spam .wpcf7-response-output,
.pixel-contact-form form.unaccepted .wpcf7-response-output {

    color: #a61b1b !important;

    background: #fff1f1 !important;

    border-color: #e3a0a0 !important;
}


/* =========================================================
   TABLET
   768px - 1024px
   ========================================================= */

@media (min-width: 768px) and (max-width: 1024px) {

    .pixel-contact-form form.wpcf7-form > p:has(input[type="text"]),
    .pixel-contact-form form.wpcf7-form > p:has(input[type="email"]),
    .pixel-contact-form form.wpcf7-form > p:has(input[type="tel"]),
    .pixel-contact-form form.wpcf7-form > p:has(select),
    .pixel-contact-form form.wpcf7-form > p:has(textarea) {

        margin-bottom: 26px !important;
    }


    .pixel-contact-form form.wpcf7-form > p:has(input[type="submit"]) {

        margin-top: 34px !important;
    }


    .pixel-contact-form form.wpcf7-form label {

        font-size: 14px !important;
    }


    .pixel-contact-form form.wpcf7-form input[type="text"],
    .pixel-contact-form form.wpcf7-form input[type="email"],
    .pixel-contact-form form.wpcf7-form input[type="tel"],
    .pixel-contact-form form.wpcf7-form input[type="number"],
    .pixel-contact-form form.wpcf7-form select {

        height: 34px !important;
        min-height: 34px !important;

        font-size: 14px !important;
    }


    .pixel-contact-form form.wpcf7-form textarea {

        height: 75px !important;
        min-height: 75px !important;
        max-height: 75px !important;

        font-size: 14px !important;
    }


    .pixel-contact-form form.wpcf7-form input::placeholder,
    .pixel-contact-form form.wpcf7-form textarea::placeholder {

        font-size: 14px !important;
    }


    .pixel-contact-form form.wpcf7-form input[type="submit"] {

        padding: 10px 19px !important;

        font-size: 14px !important;
    }


    .pixel-contact-form .wpcf7-response-output {

        font-size: 12px !important;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .pixel-contact-form form.wpcf7-form > p:has(input[type="text"]),
    .pixel-contact-form form.wpcf7-form > p:has(input[type="email"]),
    .pixel-contact-form form.wpcf7-form > p:has(input[type="tel"]),
    .pixel-contact-form form.wpcf7-form > p:has(select),
    .pixel-contact-form form.wpcf7-form > p:has(textarea) {

        margin-bottom: 24px !important;
    }


    .pixel-contact-form form.wpcf7-form > p:has(input[type="submit"]) {

        margin-top: 28px !important;
    }


    .pixel-contact-form form.wpcf7-form label {

        font-size: 14px !important;
    }


    .pixel-contact-form form.wpcf7-form input[type="text"],
    .pixel-contact-form form.wpcf7-form input[type="email"],
    .pixel-contact-form form.wpcf7-form input[type="tel"],
    .pixel-contact-form form.wpcf7-form input[type="number"],
    .pixel-contact-form form.wpcf7-form select {

        height: 34px !important;
        min-height: 34px !important;

        font-size: 14px !important;
    }


    .pixel-contact-form form.wpcf7-form textarea {

        height: 72px !important;
        min-height: 72px !important;
        max-height: 72px !important;

        font-size: 14px !important;
    }


    .pixel-contact-form form.wpcf7-form input::placeholder,
    .pixel-contact-form form.wpcf7-form textarea::placeholder {

        font-size: 14px !important;
    }


    .pixel-contact-form form.wpcf7-form input[type="submit"] {

        padding: 10px 18px !important;

        font-size: 14px !important;
    }


    .pixel-contact-form .wpcf7-response-output {

        font-size: 12px !important;

        padding: 8px 9px !important;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .pixel-contact-form form.wpcf7-form > p:has(input[type="text"]),
    .pixel-contact-form form.wpcf7-form > p:has(input[type="email"]),
    .pixel-contact-form form.wpcf7-form > p:has(input[type="tel"]),
    .pixel-contact-form form.wpcf7-form > p:has(select),
    .pixel-contact-form form.wpcf7-form > p:has(textarea) {

        margin-bottom: 22px !important;
    }


    .pixel-contact-form form.wpcf7-form > p:has(input[type="submit"]) {

        margin-top: 24px !important;
    }


    .pixel-contact-form form.wpcf7-form label {

        font-size: 13.5px !important;
    }


    .pixel-contact-form form.wpcf7-form input[type="text"],
    .pixel-contact-form form.wpcf7-form input[type="email"],
    .pixel-contact-form form.wpcf7-form input[type="tel"],
    .pixel-contact-form form.wpcf7-form input[type="number"],
    .pixel-contact-form form.wpcf7-form select {

        height: 33px !important;
        min-height: 33px !important;

        font-size: 13.5px !important;
    }


    .pixel-contact-form form.wpcf7-form textarea {

        height: 68px !important;
        min-height: 68px !important;
        max-height: 68px !important;

        font-size: 13.5px !important;
    }


    .pixel-contact-form form.wpcf7-form input::placeholder,
    .pixel-contact-form form.wpcf7-form textarea::placeholder {

        font-size: 13.5px !important;
    }


    .pixel-contact-form form.wpcf7-form input[type="submit"] {

        padding: 10px 17px !important;

        font-size: 13px !important;
    }


    .pixel-contact-form .wpcf7-response-output {

        font-size: 12px !important;

        padding: 8px !important;

        margin-top: 8px !important;
    }
}


/* =========================================================
   OUTER POPUP CONTAINER
   CSS Class applied to the popup/container widget: contact-popup
   ========================================================= */

.contact-popup {

    border-radius: 16px !important;

    overflow: hidden !important;

    box-sizing: border-box !important;
}/* End custom CSS */