:root {
    --beckman-red: #ea1c2c;
    --beckman-purple: #983cc9;
    --beckman-gray: #7c858c;
    --beckman-link-blue: #0088cc;
    --beckman-link-black: #000;
    --border-color: rgba(124, 133, 140, 0.3);
    --font-weight: 400;
    --font-weight-bold: 600;
    --beckman-dark-blue: #290076;
    --beckman-volume-grey: #BCC0C7;
    --beckman-hover-blue: #1e70bf;
}

.coveo-global-search {
    justify-content: center;
    align-items: center;
    flex-direction: row;
    width: 325px;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    z-index: 1;
    padding-top: 10px;
    border-bottom: 6px solid var(--beckman-purple);
/*    transition-delay: .1s;*/
}

    .coveo-global-search .CoveoSearchInterface{
        min-width: 300px;
    }

    .coveo-global-search .CoveoSearchbox .CoveoSearchButton {
        border: none;
    }

    .coveo-global-search .close-large-searchbox {
        visibility: hidden;
        position: absolute;
        right: 2px;
        top: 26px;
        color: #ea1c2c;
        cursor: pointer;
        width: 16px;
        height: 16px;
    }

    .coveo-global-search .CoveoSearchbox .magic-box {
        border: none;
    }

        .coveo-global-search .CoveoSearchbox .magic-box .magic-box-input > input {
            font-family: ProximaNova, Montserrat, Arial, sans-serif;
            font-size: 16px;
            font-weight: 500;
            width: 100%;
            padding-right: 10px;
            max-width: none;
        }

            .coveo-global-search .CoveoSearchbox .magic-box .magic-box-input > input::placeholder {
                transition: all 1s ease-in-out;
                opacity: .6;
            }

            .coveo-global-search .CoveoSearchbox .magic-box .magic-box-input > input:focus::placeholder {
                opacity: 0;
            }

        .coveo-global-search .CoveoSearchbox .magic-box .magic-box-clear-svg {
            color: #ea1c2c;
            height: 16px;
            width: 16px;
            opacity: .7;
        }

    /* Expanded search on focus */
    .coveo-global-search:focus-within {
/*        width: 70%;
        transform: translateX(-20%);*/
/*        -webkit-transition: all .5s cubic-bezier(0, 0, .12, .99) .2s;
        -moz-transition: all .5s cubic-bezier(0, 0, .12, .99) .2s;
        -o-transition: all .5s cubic-bezier(0, 0, .12, .99) .2s;
        transition: all .5s cubic-bezier(0, 0, .12, .99) .2s;*/
    }

        .coveo-global-search:focus-within .close-large-searchbox {
            visibility: visible;
        }

        .coveo-global-search:focus-within .CoveoSearchbox .magic-box .magic-box-input > input {
            color: #000000;
            width: 100%;
            max-width: none;
        }



    /* Uncomment remaining styles to use search icon in front of search box, not default button after*/
    .coveo-global-search .lnr-magnifier {
        position: absolute;
        left: 2px;
        top: 26px;
        color: #000;
        cursor: pointer;
        display: inline;
        width: 16px;
        height: 16px;
    }

    .coveo-global-search .coveo-search-section {
        margin-left: 25px;
    }

    .coveo-global-search .CoveoSearchbox .CoveoSearchButton {
        visibility: hidden;
        position: absolute;
        right: 0;
    }

.magic-box-clear-svg {
    color: black !important;
    height: 15px !important;
    width: 15px !important;
    opacity: 0.5 !important;
    stroke: #fff;
    stroke-width: 1px;
}

.coveo-global-search:focus-within .close-large-searchbox {
    visibility: hidden !important;
}

@media (max-width: 767px) {
    .coveo-global-search {
        height: auto;
        width: 100%;
    }

        .coveo-global-search:focus-within {
            width: 100%;
            right: auto;
            transform: none;
        }

        .coveo-global-search .lnr-magnifier {
            left: 12px !important;
        }

    .CoveoSearchInterface .CoveoSearchbox {
        margin-right: 25px !important;
    }

    .coveo-global-search .CoveoSearchbox .CoveoSearchButton {
        display: none !important;
    }

    .primary-navigation #dx-navigation .menu-item .menu-item-wrapper:after {
        content: none;
    }

    .magic-box .magic-box-clear {
        transition: none !important;
    }
}