.popup-wrapper {
    position: fixed;
    right: 0;
    top:400px;
    display: flex;
    z-index: 1000;
}
.popup-button {
    width: 40px;
    
    font-size: 18px;
    padding: 10px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    color: #ffffff;
    background-color: var(--red);
    border: none;
    outline: none;
    cursor: pointer;
    border-radius: 5px 0 0 5px;
}
.popup-button:hover {
    background-color: var(--lightRed);
}

.popup-content {
    display: none;
    text-align: center;
    padding: 10px;
    background-color: var(--lightGrey);
    transition: all .5s ease-in-out;

}
.popup-content > h4 {
    font-size: 13px;
    margin-bottom: 5px;
}
.popup-content > h3 {
    margin-top: 5px;
}
.popup-content a {
    color: #000000;
    text-decoration: none;
}
.popup-content a:hover {
    color: #000000;
}
.popup-content a:active {
    color: #000000;
}
.icon-close {
    display: none !important;
}
/* Targeting the popup-open and the popup-content and tell it what to do */
.popup-open .popup-content {
    display: initial;
}
/* Target popup-open and the icons to change when content open/close */
.popup-open .icon-phone {
    display: none;
}

.popup-open .icon-close {
    display: initial !important;
}
