
/* CSS for the new contact cards */
.contact-embedded-wrapper.generic {
    background-image: none;
    background-color: transparent;
    padding: 50px;
}
.contact-embedded-wrapper.generic .title p {color:white;}
    .contact-embedded-wrapper.generic .creds strong {
        color: black;
        font-family: var(--base-font);
    }
    .contact-embedded-wrapper.generic .card .creds {
        height: 160px;
    }
    .contact-embedded-background {
        background-image: url(/WebsiteTemplates/IEDC/App_Themes/DefaultTheme/global/css/imgs/contactGear-bg.png);
        background-repeat: no-repeat;
        background-size: 135px 135px;
        background-position: top left;
        background-color: #E4EFF8;
        margin-top: 40px;
    }
.ser-contact-pop .form-container {
    max-width: 1024px;
    height: 600px;
    margin: 100px auto;
}


.contact-card-pop {
    width: 100%;
    top: 0px;
    left: 0px;
    z-index: 100;
    position: fixed;
    overflow-y: scroll;
    background: rgb(53 77 119 / 82%);
}
    .contact-card-pop .form-container {
        max-width: 1024px;
        height: 670px;
        margin: 100px auto;
        position: relative;
    }
        .contact-card-pop .form-container .mc_embed_signup {
            padding: 0px 0px 30px;
            height: 100%;
            overflow-y: auto;
            width: 100%;
            max-width: unset;
            margin: 0px auto;
            text-align: center;
            position: relative;
            background-color: white;
        }
        .contact-card-pop .form-container .close-form {
            width: 18px;
            height: 18px;
            position: absolute;
            top: 16px;
            right: 16px;
            background: url(/WebsiteTemplates/IEDC/App_Themes/DefaultTheme/global/css/imgs/btn-close-form.png) no-repeat;
            cursor: pointer;
            text-indent: -75px;
            line-height: 16px;
        }
        .contact-card-pop .form-container .title-block {
            width: 100%;
            background-color: white;
            text-align: center;
            margin: 0px 0px 20px 0px;
        }
            .contact-card-pop .form-container .title-block p {
                text-transform: uppercase;
                color: #1c355e;
                font-weight: bold;
                font-size: 25px;
                font-family: var(--feature-font);
            }
        .contact-card-pop .form-container .flex-wrap {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: center;
            align-items: stretch;
            align-content: space-around;
        }
            .contact-card-pop .form-container .flex-wrap .contact-info {
                width: 40%;
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                justify-content: space-evenly;
                align-items: center;
                border: 1px solid #55aafa;
                border-top: 15px solid #55aafa;
                padding: 10px;
            }
            .contact-card-pop .form-container .flex-wrap .contact-info .col1 {
                width: 27%;
            }
                .contact-card-pop .form-container .flex-wrap .contact-info .col1 img {
                    border: 1px solid #55aafa;
                }
                .contact-card-pop .form-container .flex-wrap .contact-info .col2 {
                    width: 63%;
                    text-align: left;
                    padding: 0 10px 20px;
                }
                    .contact-card-pop .form-container .flex-wrap .contact-info .col2 .name,
                    .contact-card-pop .form-container .flex-wrap .contact-info .col2 .title {
                        font-weight: bold;
                    }
                .contact-card-pop .form-container .flex-wrap .hidden-grp {
                    width: 3%;
                }
            .contact-card-pop .form-container .flex-wrap .first-field-grp {
                width: 50%;
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                justify-content: space-between;
                align-content: stretch;
            }
                .contact-card-pop .form-container .flex-wrap .first-field-grp input,
                .contact-card-pop .form-container .flex-wrap .first-field-grp select {
                    margin-bottom: 10px;
                    width: 49%;
                }
        .contact-card-pop .form-container .flex-wrap .second-field-grp {
            width: 100%;
        }
            .contact-card-pop .form-container .flex-wrap .second-field-grp label {
                float: left;
                font-family: var(--base-font);
                margin: 0 0 0 3.34%;
                color: #1c355e;
                font-weight: bold;
            }
            .contact-card-pop .form-container .flex-wrap .second-field-grp textarea {
                width: 93%;
                margin: 6px 3%;
                min-height: 200px;
            }
            .contact-card-pop .form-container .flex-wrap .second-field-grp .g-recaptcha {
                margin: 6px 4%;
                float: left;
            }
            .contact-card-pop .form-container .flex-wrap .second-field-grp .ser-form-submit {
                float: right;
                margin: 10px 4%;
                padding: 6px 18px;
                background-color: #ffd824;
                font-family: var(--feature-font);
                text-transform: uppercase;
                color: #1c355e;
                font-weight: bold;
                font-size: 13px;
                cursor: pointer;
                border: none;
                border-bottom: 2px solid #fcc233;
                border-right: 2px solid #fcc233;
            }
@media screen and (max-width: 880px) {
    .contact-embedded-wrapper.generic {
        padding: 0px;
    }
    .contact-embedded-background .sf_2cols_1_50, 
    .contact-embedded-background .sf_2cols_2_50 {
        width: 100%;
    }
}

@media screen and (max-width: 700px) {
    .contact-card-pop .form-container .flex-wrap .hidden-grp {
        width: 0;
    }

    .contact-card-pop .form-container .flex-wrap .contact-info {
        margin: 10px;
        width: 100%;
    }

    .contact-card-pop .form-container .flex-wrap .first-field-grp {
        width: 100%;
        padding: 20px;
    }
}
.contact-embedded-wrapper .card.no-pointer {
    cursor:auto;
}

/* Generic style for small (1/3 width) contact cards */
.contact-embedded-wrapper.generic.small {
    padding: 0;
    max-width: 337px;
}
    .contact-embedded-wrapper.small .card .rep-info {
        margin: 10px 20px;
    }
    .contact-embedded-wrapper.small .card .photo {
        padding: 0px;
    }
.contact-embedded-wrapper.small .card .photo img  {
    width: 100%;
}
.contact-embedded-wrapper.generic.small .card .creds {
    height: 146px;
}
.contact-embedded-wrapper.generic.small .creds strong {
    font-size: 17px;
}
@media screen and (max-width: 880px) {
    .contact-embedded-wrapper.generic.small .card .creds {
        width: 67%;
    }
}